search

necolas / react-native-web

Cross-platform React UI packages
https://necolas.github.io/react-native-web
MIT License
21.69k stars 1.79k forks source link

Text preferred html component prop #2735

Closed zsoltbokor closed 2 weeks ago

zsoltbokor commented 2 weeks ago

Is there an existing request?

Describe the feature request

Currently there is a logic in the Text component to decide what html component to be rendered. So it can render div, span, a.

On a website a text can have role title, subtitle, paragraph etc.

Idea: Extend TextProps so include a new property preferredHTMLElement. Then if the Text will be used as title on a page it can get H1, H2 etc. That could help to boost SEO.

Alternative solution: use data attribute, e.g data-html-element (CON: can't limit the possible values)

Usage example:

 <View>
    <Text preferredHTMLElement="h1">I am the title</Text>
     <Text preferredHTMLElement="h2">I am the sub-title</Text>

      <Text preferredHTMLElement="p">I am just a paragraph</Text>
 </View>
necolas commented 2 weeks ago

You can use the relevant role and aria-level to render headings