mirror of
https://github.com/zoriya/react-native-web.git
synced 2026-06-03 02:42:05 +00:00
Fix UIExplorer headings accessibility
This commit is contained in:
@@ -14,12 +14,12 @@ class AppText extends React.PureComponent {
|
|||||||
};
|
};
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
const { style, ...rest } = this.props;
|
const { accessibilityRole, style, ...rest } = this.props;
|
||||||
const isInAParentText = this.context;
|
const isInAParentText = this.context;
|
||||||
return (
|
return (
|
||||||
<Text
|
<Text
|
||||||
{...rest}
|
{...rest}
|
||||||
accessibilityRole={rest.href ? 'link' : undefined}
|
accessibilityRole={rest.href ? 'link' : accessibilityRole}
|
||||||
style={[!isInAParentText && styles.baseText, style, rest.href && styles.link]}
|
style={[!isInAParentText && styles.baseText, style, rest.href && styles.link]}
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
|
|||||||
@@ -8,7 +8,11 @@ import AppText from './AppText';
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { StyleSheet, View } from 'react-native';
|
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 }) => (
|
const Section = ({ children, title }) => (
|
||||||
<View>
|
<View>
|
||||||
|
|||||||
@@ -10,7 +10,11 @@ import insertBetween from './insertBetween';
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { StyleSheet, View } from 'react-native';
|
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 }) => (
|
export const Description = ({ children }) => (
|
||||||
<AppText style={styles.description}>
|
<AppText style={styles.description}>
|
||||||
|
|||||||
Reference in New Issue
Block a user