Expo UI

A set of components that allow you to build UIs directly with SwiftUI and Jetpack Compose from React.

Bundled version:
~0.1.1-alpha.10
This library is currently in alpha and will frequently experience breaking changes. It is not available in the Expo Go app – use development builds to try it out.
@expo/ui is a set of native input components that allows you to build fully native interfaces with SwiftUI and Jetpack Compose. It aims to provide the commonly used features and components that a typical app will need.

Installation
Terminal

Copy

npx expo install @expo/ui
If you are installing this in an existing React Native app, make sure to install expo in your project.

Swift UI examples
BottomSheet

iOS

Code

BottomSheet component on iOS.
Button

iOS

Code

Button component on iOS.
CircularProgress

iOS

Code

CircularProgress component on iOS.
ColorPicker

iOS

Code

ColorPicker component on iOS.
ContextMenu
Note: Also known as DropdownMenu.

iOS

Code

ContextMenu component on iOS.
DateTimePicker (date)

iOS

Code

DateTimePicker (date) component on iOS.
DateTimePicker (time)

iOS

Code

DateTimePicker (time) component on iOS.
Gauge

iOS

Code

Gauge component on iOS.
LinearProgress

iOS

Code

LinearProgress component on iOS.
List

iOS

Code

List component on iOS.
Picker (segmented)

iOS

Code

Picker component on iOS.
Picker (wheel)

iOS

Code

Picker component on iOS.
Slider

iOS

Code

Slider component on iOS.
Switch (toggle)
Note: Also known as Toggle.

iOS

Code

Switch component on iOS.
Switch (checkbox)

iOS

Code

Picker component on iOS.
TextInput

iOS

Code

TextInput component on iOS.
Jetpack Compose examples
Button

Android

Code

Button component on Android.
CircularProgress

Android

Code

CircularProgress component on Android.
ContextMenu
Note: Also known as DropdownMenu.

Android

Code

ContextMenu component on Android.
DateTimePicker (date)

Android

Code

DateTimePicker component on Android.
DateTimePicker (time)

Android

Code

DateTimePicker (time) component on Android.
LinearProgress

Android

Code

LinearProgress component on Android.
Picker (radio)

Android

Code

Picker component (radio) on Android.
Picker (segmented)

Android

Code

Picker component on Android.
Slider

Android

Code

Slider component on Android.
Switch (toggle)
Note: Also known as Toggle.

Android

Code

Switch component on Android.
Switch (checkbox)

Android

Code

Switch (checkbox variant) component on Android.
TextInput

Android

Code

TextInput component on Android.
API
Full documentation is not yet available. Use TypeScript types to explore the API.

// Import from the SwiftUI package
import { BottomSheet } from '@expo/ui/swift-ui';
// Import from the Jetpack Compose package
import { Button } from '@expo/ui/jetpack-compose';