@expo/html-elements

Product: demo

Supports Expo iOS Supports Expo Android Supports Expo Web Circle CI

Simple, light-weight, and well tested, universal semantic HTML elements as React components for iOS, Android, web, and desktop apps! We at Expo recommend using platform agnostic primitives like `View`, `Image`, and `Text` whenever possible but sometimes that's not easy. Some primitives like Tables, and Footers are native to web only and currently have no way of easily accessing. This package aims to solve that while still being an optimal UI package for iOS, and Android. ### What you get - Using `@expo/html-elements` will optimize your website for SEO and accessibility. Meaning your websites are indexed more accurately and your native apps better accommodate physically impaired users. - This package takes full advantage of [`react-native-web` a11y rules](https://github.com/necolas/react-native-web/blob/master/packages/docs/src/guides/accessibility.stories.mdx) whenever possible. - For example, the `H1` component will render an `

` on web, a `UILabel` on iOS, and a `TextView` on Android. - Every component can accept styles from the `StyleSheet` API. - TypeScript works for iOS, Android, and web, no more having to create monkey patches to use `href` on a `Text` element. - Every component is tested render **tested universally** for iOS, Android, and Web using the package [`jest-expo-enzyme`](https://www.npmjs.com/package/jest-expo-enzyme). Each element is also **E2E tested** on iOS with Detox, and web with [`jest-expo-puppeteer`](https://www.npmjs.com/package/jest-expo-puppeteer). - This package is completely side-effect free! ## Setup Install: ``` yarn add @expo/html-elements ``` Import and use the package: ```tsx import { H1 } from '@expo/html-elements'; ``` # Components Here is a list of all the currently supported elements and the web feature they map to. Not all HTML elements are supported. There are some HTML elements that mostly overlap with some universal modules, you should always try to use the universal modules whenever possible. All supported components are a capitalized variation of the semantic HTML they implement/emulate. | HTML | `@expo/html-elements` | | ----------------------------------- | :-----------------------------: | | [``][html-a] | [``](#a) | | [`
`][html-article] | [`
`](#article) | | [`