Expo SDK

https://docs.expo.dev/versions/latest/
Admin
The Expo SDK provides a collection of packages that enable React Native applications to access...
Tokens:669,749
Snippets:5,728
Trust Score:10
Update:1 week ago
Show doc for...
Tokens:
Raw
### Install @expo/ui with Bun

Source: https://docs.expo.dev/versions/latest/sdk/ui/jetpack-compose/flowrow

Installs the @expo/ui package using Bun.

```sh
bun expo install @expo/ui
```

--------------------------------

### Install expo-media-library

Source: https://docs.expo.dev/versions/latest/sdk/media-library

Install the expo-media-library package using npm, yarn, pnpm, or bun.

```bash
# npm
npx expo install expo-media-library

# yarn
yarn expo install expo-media-library

# pnpm
pnpm expo install expo-media-library

# bun
bun expo install expo-media-library
```

--------------------------------

### Install @expo/ui

Source: https://docs.expo.dev/versions/latest/sdk/ui/universal

Install the `@expo/ui` package using your preferred package manager.

```bash
# npm
npx expo install @expo/ui

# yarn
yarn expo install @expo/ui

# pnpm
pnpm expo install @expo/ui

# bun
bun expo install @expo/ui
```

--------------------------------

### Install expo-system-ui

Source: https://docs.expo.dev/versions/latest/sdk/system-ui

Install the expo-system-ui package using npm, yarn, pnpm, or bun.

```sh
# npm
npx expo install expo-system-ui

# yarn
yarn expo install expo-system-ui

# pnpm
pnpm expo install expo-system-ui

# bun
bun expo install expo-system-ui
```

--------------------------------

### Install expo-document-picker

Source: https://docs.expo.dev/versions/latest/sdk/document-picker

Install the package in your project using your preferred package manager.

```bash
# npm
npx expo install expo-document-picker

# yarn
yarn expo install expo-document-picker

# pnpm
pnpm expo install expo-document-picker

# bun
bun expo install expo-document-picker
```

--------------------------------

### Install react-native-screens with bun

Source: https://docs.expo.dev/versions/latest/sdk/screens

Install the library using bun in an Expo project.

```sh
bun expo install react-native-screens
```

--------------------------------

### Install @expo/ui with pnpm

Source: https://docs.expo.dev/versions/latest/sdk/ui/jetpack-compose/flowrow

Installs the @expo/ui package using pnpm.

```sh
pnpm expo install @expo/ui
```

--------------------------------

### Install @expo/ui with npm

Source: https://docs.expo.dev/versions/latest/sdk/ui/jetpack-compose/flowrow

Installs the @expo/ui package using npm.

```sh
npx expo install @expo/ui
```

--------------------------------

### Install @expo/ui with Yarn

Source: https://docs.expo.dev/versions/latest/sdk/ui/jetpack-compose/flowrow

Installs the @expo/ui package using Yarn.

```sh
yarn expo install @expo/ui
```

--------------------------------

### Application.getInstallReferrerAsync()

Source: https://docs.expo.dev/versions/latest/sdk/application

Gets the referrer URL of the installed app via the Google Play Store Install Referrer API.

```APIDOC
## Application.getInstallReferrerAsync()

### Description
Gets the referrer URL of the installed app with the Install Referrer API from the Google Play Store.

### Supported Platforms
- Android

### Return Value
- **Promise<string>**: A `Promise` that fulfills with the referrer URL string.

### Code Example
```ts
await Application.getInstallReferrerAsync();
// "utm_source=google-play&utm_medium=organic"
```
```

--------------------------------

### Create project from with-splash-screen example

Source: https://docs.expo.dev/versions/latest/sdk/splash-screen

Initialize a new project using the preconfigured with-splash-screen template.

```sh
# npm
npx create-expo-app --example with-splash-screen

# yarn
yarn create expo-app --example with-splash-screen

# pnpm
pnpm create expo-app --example with-splash-screen

# bun
bun create expo --example with-splash-screen
```

--------------------------------

### Create a project with with-sqlite example template

Source: https://docs.expo.dev/versions/latest/sdk/sqlite

Initialize a new Expo project using the with-sqlite example template, which includes expo-sqlite pre-installed and pre-configured.

```sh
# npm
npx create-expo-app --example with-sqlite

# yarn
yarn create expo-app --example with-sqlite

# pnpm
pnpm create expo-app --example with-sqlite

# bun
bun create expo --example with-sqlite
```

--------------------------------

### Install @react-native-async-storage/async-storage

Source: https://docs.expo.dev/versions/latest/sdk/async-storage

Install the package in an Expo project using npm, yarn, pnpm, or bun. For bare React Native apps, ensure expo is installed before following the library's setup instructions.

```sh
# npm
npx expo install @react-native-async-storage/async-storage

# yarn
yarn expo install @react-native-async-storage/async-storage

# pnpm
pnpm expo install @react-native-async-storage/async-storage

# bun
bun expo install @react-native-async-storage/async-storage
```

--------------------------------

### Application.getInstallationTimeAsync()

Source: https://docs.expo.dev/versions/latest/sdk/application

Gets the date and time when the app was installed onto the device.

```APIDOC
## Application.getInstallationTimeAsync()

### Description
Gets the time the app was installed onto the device, not counting subsequent updates. If the app is uninstalled and reinstalled, this method returns the time the app was reinstalled.

### Supported Platforms
- Android
- iOS
- tvOS
- Web

### Return Value
- **Promise<Date>**: A `Promise` that fulfills with a `Date` object specifying the installation timestamp (returns `null` on Web).

### Code Example
```ts
await Application.getInstallationTimeAsync();
// 2019-07-18T18:08:26.121Z
```
```

--------------------------------

### Install expo-media-library

Source: https://docs.expo.dev/versions/latest/sdk/media-library-legacy

Run the install command using your preferred package manager to add expo-media-library to your project.

```sh
# npm
npx expo install expo-media-library

# yarn
yarn expo install expo-media-library

# pnpm
pnpm expo install expo-media-library

# bun
bun expo install expo-media-library
```

--------------------------------

### Icon source prop examples

Source: https://docs.expo.dev/versions/latest/sdk/ui/jetpack-compose/icon

Shows how to set the source using require() or a URI string.

```tsx
<Icon source={require('./assets/home.xml')} />
<Icon source={{ uri: 'file:///path/to/icon.xml' }} />
```

--------------------------------

### Get Play Store referrer with Application.getInstallReferrerAsync()

Source: https://docs.expo.dev/versions/latest/sdk/application

Fetches the referrer URL of the installed application using Google Play's Install Referrer API. Supported only on Android.

```typescript
await Application.getInstallReferrerAsync();
// "utm_source=google-play&utm_medium=organic"
```

--------------------------------

### Get installation timestamp with Application.getInstallationTimeAsync()

Source: https://docs.expo.dev/versions/latest/sdk/application

Retrieves the time the app was originally installed or reinstalled onto the device. Resolves to a Date object on Android, iOS, and tvOS, and returns null on web.

```typescript
await Application.getInstallationTimeAsync();
// 2019-07-18T18:08:26.121Z
```

--------------------------------

### Create project from with-maps example template

Source: https://docs.expo.dev/versions/latest/sdk/maps

Bootstrap a new Expo project pre-configured with expo-maps using create-expo-app.

```sh
# npm
npx create-expo-app --example with-maps

# yarn
yarn create expo-app --example with-maps

# pnpm
pnpm create expo-app --example with-maps

# bun
bun create expo --example with-maps
```

--------------------------------

### Install @shopify/flash-list

Source: https://docs.expo.dev/versions/latest/sdk/flash-list

Install the package using the Expo CLI with your preferred package manager. For existing React Native apps, ensure Expo modules are configured before following the library setup.

```sh
# npm
npx expo install @shopify/flash-list

# yarn
yarn expo install @shopify/flash-list

# pnpm
pnpm expo install @shopify/flash-list

# bun
bun expo install @shopify/flash-list
```

--------------------------------

### Configure Stack.Toolbar.Menu with icon, label, and menu actions

Source: https://docs.expo.dev/versions/latest/sdk/router/stack

Demonstrates how to build menu content inside a toolbar using icons, labels, and interactive menu actions.

```tsx
<Stack.Toolbar.Menu>
  <Stack.Toolbar.Icon sfSymbol="ellipsis.circle" />
  <Stack.Toolbar.Label>Options</Stack.Toolbar.Label>
  <Stack.Toolbar.MenuAction onPress={() => {}}>Action 1</Stack.Toolbar.MenuAction>
</Stack.Toolbar.Menu>
```

--------------------------------

### Basic DisclosureGroup example

Source: https://docs.expo.dev/versions/latest/sdk/ui/swift-ui/disclosuregroup

Use DisclosureGroup with a label string and controlled isExpanded state. Place inside a Form and Section to get standard iOS list styling and chevron indicator.

```tsx
import { useState } from 'react';
import {
  DisclosureGroup,
  Form,
  Host,
  Section,
  Text,
} from '@expo/ui/swift-ui';

export default function BasicDisclosureGroupExample() {
  const [isExpanded, setIsExpanded] = useState(true);
  return (
    <Host style={{ flex: 1 }}>
      <Form>
        <Section>
          <DisclosureGroup
            label="Advanced settings"
            isExpanded={isExpanded}
            onIsExpandedChange={setIsExpanded}>
            <Text>Auto-update apps</Text>
            <Text>App downloads</Text>
            <Text>Offload unused apps</Text>
          </DisclosureGroup>
        </Section>
      </Form>
    </Host>
  );
}
```

--------------------------------

### Exclude libraries from Expo version checks with expo.install.exclude

Source: https://docs.expo.dev/versions/latest/config/package-json

Add libraries under the install.exclude array in package.json to exclude them from version checks performed by npx expo start, npx expo-doctor, and npx expo install.

```json
{
  "expo": {
    "install": {
      "exclude": ["expo-updates", "expo-splash-screen"]
    }
  }
}
```

--------------------------------

### Icon tint prop examples

Source: https://docs.expo.dev/versions/latest/sdk/ui/jetpack-compose/icon

Shows how to apply tint colors, including hex, named colors, and null for no tint.

```tsx
<Icon source={require('./assets/star.xml')} tint="#007AFF" />
<Icon source={require('./assets/star.xml')} tint="blue" />
<Icon source={require('./assets/multicolor.xml')} tint={null} />
```

--------------------------------

### Install @expo/app-integrity

Source: https://docs.expo.dev/versions/latest/sdk/app-integrity

Install the @expo/app-integrity package in your project using your package manager of choice. If installing in an existing React Native app, ensure expo is already installed.

```sh
# npm
npx expo install @expo/app-integrity

# yarn
yarn expo install @expo/app-integrity

# pnpm
pnpm expo install @expo/app-integrity

# bun
bun expo install @expo/app-integrity
```

--------------------------------

### Install expo-manifests package

Source: https://docs.expo.dev/versions/latest/sdk/manifests

Install expo-manifests into your Expo project using your preferred package manager. If installing in an existing React Native app, ensure the expo package is installed first.

```sh
# npm
npx expo install expo-manifests

# yarn
yarn expo install expo-manifests

# pnpm
pnpm expo install expo-manifests

# bun
bun expo install expo-manifests
```

--------------------------------

### AudioRecorder.prepareToRecordAsync(options)

Source: https://docs.expo.dev/versions/latest/sdk/audio

Prepares the recording session with the specified options.

```APIDOC
### `AudioRecorder.prepareToRecordAsync(options)`

Prepares the recording for recording.

**Supported Platforms:** Android, iOS, tvOS, Web

#### Parameters
- `options` (`Partial<RecordingOptions>`) - Optional. Recording options configuration.

#### Returns
- `Promise<void>`
```

--------------------------------

### Install @expo/ui with npm, yarn, pnpm, or bun

Source: https://docs.expo.dev/versions/latest/sdk/ui/jetpack-compose/box

Install the @expo/ui package using your preferred package manager. If installing in an existing React Native app, make sure to install expo first.

```sh
# npm
npx expo install @expo/ui

# yarn
yarn expo install @expo/ui

# pnpm
pnpm expo install @expo/ui

# bun
bun expo install @expo/ui
```

--------------------------------

### Install expo-gl

Source: https://docs.expo.dev/versions/latest/sdk/gl-view

Run the install command using your package manager of choice to add expo-gl to your project.

```sh
# npm
npx expo install expo-gl

# yarn
yarn expo install expo-gl

# pnpm
pnpm expo install expo-gl

# bun
bun expo install expo-gl
```

--------------------------------

### Install @stripe/stripe-react-native

Source: https://docs.expo.dev/versions/latest/sdk/stripe

Run the install command with your package manager to install the compatible @stripe/stripe-react-native version for your Expo SDK version.

```sh
# npm
npx expo install @stripe/stripe-react-native

# yarn
yarn expo install @stripe/stripe-react-native

# pnpm
pnpm expo install @stripe/stripe-react-native

# bun
bun expo install @stripe/stripe-react-native
```

--------------------------------

### create(options)

Source: https://docs.expo.dev/versions/latest/sdk/filesystem

Creates a new file with optional configuration options. Supported on Android, iOS, and tvOS.

```APIDOC
### `create(options)`

**Supported platforms:** Android, iOS, tvOS

Creates a file.

#### Parameters
- **options** (`FileCreateOptions`) - Optional - Options for creating the file.

#### Returns
- `void`
```

--------------------------------

### Create a Directory instance

Source: https://docs.expo.dev/versions/latest/sdk/filesystem

Instantiates a new Directory using a base Directory path and a subdirectory name string. The directory does not need to exist on the filesystem when created.

```ts
const directory = new Directory(Paths.cache, "subdirName");
```

--------------------------------

### Install @expo/material-symbols

Source: https://docs.expo.dev/versions/latest/sdk/ui/jetpack-compose/icon

Optionally install @expo/material-symbols to use the bundled icon assets. No install is needed if you use the CLI for custom styles.

```sh
npx expo install @expo/material-symbols
```

--------------------------------

### FileSystem.makeDirectoryAsync(fileUri, options)

Source: https://docs.expo.dev/versions/latest/sdk/filesystem-legacy

Creates a new empty directory at the specified file URI with optional configuration options.

```APIDOC
## FileSystem.makeDirectoryAsync(fileUri, options)

### Description
Create a new empty directory.

### Supported Platforms
- Android
- iOS
- tvOS

### Parameters
- **fileUri** (`string`) - Required - `file://` URI to the new directory to create.
- **options** (`MakeDirectoryOptions`) - Optional - A map of create directory options represented by `MakeDirectoryOptions` type. Default: `{}`

### Returns
`Promise<void>`
```

--------------------------------

### Install @expo/ui with npm, yarn, pnpm, or bun

Source: https://docs.expo.dev/versions/latest/sdk/ui/swift-ui/spacer

Install the @expo/ui package using your preferred package manager. Run this in your project directory. If you are installing in an existing React Native app, make sure to install expo first.

```sh
npx expo install @expo/ui
```

```sh
yarn expo install @expo/ui
```

```sh
pnpm expo install @expo/ui
```

```sh
bun expo install @expo/ui
```

--------------------------------

### Install expo-linking

Source: https://docs.expo.dev/versions/latest/sdk/linking

Install expo-linking across different package managers. Ensure expo is installed when using an existing React Native app.

```sh
# npm
npx expo install expo-linking

# yarn
yarn expo install expo-linking

# pnpm
pnpm expo install expo-linking

# bun
bun expo install expo-linking
```

--------------------------------

### Install expo-file-system

Source: https://docs.expo.dev/versions/latest/sdk/filesystem

Install expo-file-system using your package manager of choice. For bare React Native apps, ensure the expo package is installed.

```sh
# npm
npx expo install expo-file-system

# yarn
yarn expo install expo-file-system

# pnpm
pnpm expo install expo-file-system

# bun
bun expo install expo-file-system
```

--------------------------------

### Create project from with-camera template

Source: https://docs.expo.dev/versions/latest/sdk/camera

Initializes a new Expo project pre-configured with the expo-camera package.

```sh
# npm
npx create-expo-app --example with-camera

# yarn
yarn create expo-app --example with-camera

# pnpm
pnpm create expo-app --example with-camera

# bun
bun create expo --example with-camera
```

--------------------------------

### Install expo-glass-effect package

Source: https://docs.expo.dev/versions/latest/sdk/glass-effect

Install expo-glass-effect using your preferred package manager. For existing React Native apps, ensure the expo package is installed.

```bash
# npm
npx expo install expo-glass-effect

# yarn
yarn expo install expo-glass-effect

# pnpm
pnpm expo install expo-glass-effect

# bun
bun expo install expo-glass-effect
```

--------------------------------

### Install expo-device

Source: https://docs.expo.dev/versions/latest/sdk/device

Install the expo-device package using your preferred package manager. For existing React Native apps, ensure expo modules are installed.

```sh
# npm
npx expo install expo-device

# yarn
yarn expo install expo-device

# pnpm
pnpm expo install expo-device

# bun
bun expo install expo-device
```

--------------------------------

### Installing expo-contacts

Source: https://docs.expo.dev/versions/latest/sdk/contacts

Install expo-contacts using your preferred package manager. For existing React Native apps, ensure expo modules are installed first.

```sh
# npm
npx expo install expo-contacts

# yarn
yarn expo install expo-contacts

# pnpm
pnpm expo install expo-contacts

# bun
bun expo install expo-contacts
```

--------------------------------

### Basic SearchBar example (BasicSearchBarExample.tsx)

Source: https://docs.expo.dev/versions/latest/sdk/ui/jetpack-compose/searchbar

Renders a SearchBar inside a Host component. The onSearch callback updates the query state with the submitted search text.

```tsx
import { useState } from 'react';
import { Host, SearchBar } from '@expo/ui/jetpack-compose';

export default function BasicSearchBarExample() {
  const [query, setQuery] = useState('');

  return (
    <Host matchContents>
      <SearchBar onSearch={searchText => setQuery(searchText)} />
    </Host>
  );
}
```

--------------------------------

### Install @expo/ui

Source: https://docs.expo.dev/versions/latest/sdk/ui/jetpack-compose

Install the @expo/ui package using your preferred package manager. If using an existing React Native app, ensure expo is installed first.

```sh
# npm
npx expo install @expo/ui

# yarn
yarn expo install @expo/ui

# pnpm
pnpm expo install @expo/ui

# bun
bun expo install @expo/ui
```

--------------------------------

### Create a basic dropdown menu with Jetpack Compose

Source: https://docs.expo.dev/versions/latest/sdk/ui/jetpack-compose/dropdownmenu

Demonstrates setting up a DropdownMenu with an OutlinedButton trigger, expandable state handling, and menu items containing text and leading icons.

```tsx
import {
  Host,
  DropdownMenu,
  DropdownMenuItem,
  OutlinedButton,
  Text,
  Icon,
} from '@expo/ui/jetpack-compose';
import { useState } from 'react';

const homeIcon = require('./assets/home.xml');

export default function BasicDropdownMenuExample() {
  const [isExpanded, setIsExpanded] = useState(false);
  return (
    <Host matchContents>
      <DropdownMenu
        expanded={isExpanded}
        onDismissRequest={() => setIsExpanded(false)}>
        <DropdownMenu.Trigger>
          <OutlinedButton onClick={() => setIsExpanded(true)}>
            <Text>Show menu</Text>
          </OutlinedButton>
        </DropdownMenu.Trigger>
        <DropdownMenu.Items>
          <DropdownMenuItem
            onClick={() => {
              setIsExpanded(false);
              console.log('Home pressed');
            }}>
            <DropdownMenuItem.Text>
              <Text>Home</Text>
            </DropdownMenuItem.Text>
            <DropdownMenuItem.LeadingIcon>
              <Icon source={homeIcon} size={24} />
            </DropdownMenuItem.LeadingIcon>
          </DropdownMenuItem>
        </DropdownMenu.Items>
      </DropdownMenu>
    </Host>
  );
}
```

--------------------------------

### Install multer, sharp, and blurhash dependencies

Source: https://docs.expo.dev/versions/latest/sdk/image

Installs the required backend dependencies for parsing multipart image uploads, manipulating image buffers, and encoding blurhashes.

```sh
npm install multer sharp blurhash
```

--------------------------------

### Install expo-calendar package

Source: https://docs.expo.dev/versions/latest/sdk/calendar

Install expo-calendar using your preferred package manager. In existing React Native projects, ensure the expo package is installed first.

```bash
# npm
npx expo install expo-calendar

# yarn
yarn expo install expo-calendar

# pnpm
pnpm expo install expo-calendar

# bun
bun expo install expo-calendar
```

--------------------------------

### Install expo-sensors package

Source: https://docs.expo.dev/versions/latest/sdk/barometer

Install expo-sensors using your preferred package manager. For existing React Native projects, ensure the expo package is also installed.

```sh
# npm
npx expo install expo-sensors

# yarn
yarn expo install expo-sensors

# pnpm
pnpm expo install expo-sensors

# bun
bun expo install expo-sensors
```

--------------------------------

### IntentLauncher.startActivityAsync(activityAction, params)

Source: https://docs.expo.dev/versions/latest/sdk/intent-launcher

Starts the specified activity on Android. Returns a promise that resolves when the user returns to the app.

```APIDOC
## IntentLauncher.startActivityAsync(activityAction, params)

### Description
Starts the specified activity. The method will return a promise which resolves when the user returns to the app. Supported on Android.

### Parameters
- **activityAction** (`string`) - Required - The action to be performed, for example, `IntentLauncher.ActivityAction.WIRELESS_SETTINGS`.
- **params** (`IntentLauncherParams`) - Optional - An object of intent parameters. Default: `{}`.

### Response
- Returns `Promise<IntentLauncherResult>` - A promise which fulfils with an `IntentLauncherResult` object.
```
Tokens:
Raw