> ## Documentation Index
> Fetch the complete documentation index at: https://docs.insito.app/llms.txt
> Use this file to discover all available pages before exploring further.

# Install

> Add the Insito React Native SDK to an Expo or bare RN app in two commands.

The SDK ships as a single npm package: `@insito/react-native`. It works
in Expo managed, Expo bare, and CLI React Native projects.

<Note>
  The SDK is in **public beta** (`0.x`). It's production-usable, but the API may
  still change between minor versions until `1.0` — pin an exact version if you
  need stability.
</Note>

## Requirements

The survey modal is a [`@gorhom/bottom-sheet`](https://github.com/gorhom/react-native-bottom-sheet)
bottom sheet, so gesture-handler and reanimated are required peers.

| Peer                                        | Minimum version | Notes                                        |
| ------------------------------------------- | --------------- | -------------------------------------------- |
| `react`                                     | 18.0            |                                              |
| `react-native`                              | 0.72            |                                              |
| `@react-native-async-storage/async-storage` | 1.21            | Persistent offline queue                     |
| `@gorhom/bottom-sheet`                      | 5.0             | Modal presentation                           |
| `react-native-gesture-handler`              | 2.0             | Required by bottom-sheet                     |
| `react-native-reanimated`                   | 3.0             | Required by bottom-sheet                     |
| `expo-localization`                         | 14.0            | Optional — improves locale/timezone metadata |

## Install

<CodeGroup>
  ```bash npm theme={null}
  npm install @insito/react-native @react-native-async-storage/async-storage @gorhom/bottom-sheet react-native-gesture-handler react-native-reanimated
  ```

  ```bash yarn theme={null}
  yarn add @insito/react-native @react-native-async-storage/async-storage @gorhom/bottom-sheet react-native-gesture-handler react-native-reanimated
  ```

  ```bash pnpm theme={null}
  pnpm add @insito/react-native @react-native-async-storage/async-storage @gorhom/bottom-sheet react-native-gesture-handler react-native-reanimated
  ```

  ```bash bun theme={null}
  bun add @insito/react-native @react-native-async-storage/async-storage @gorhom/bottom-sheet react-native-gesture-handler react-native-reanimated
  ```
</CodeGroup>

<Note>
  `react-native-reanimated` requires its Babel plugin (add
  `react-native-reanimated/plugin` as the **last** entry in `babel.config.js`).
  Import `react-native-gesture-handler` at the very top of your entry file, per
  the library's setup docs.
</Note>

## Native rebuild

If you're on bare React Native, run a native rebuild once after
install — `npx pod-install` on iOS, then rebuild your dev client. Expo
managed workflows pick this up automatically on the next `expo start`.

## Initialise the SDK

`MicroSurvey.init()` boots the singleton. Call it **once**, as early
as possible — module top-level is fine.

```tsx app/_layout.tsx theme={null}
import { MicroSurvey } from "@insito/react-native";

MicroSurvey.init({
  apiKey: "proj_xxx",
  debug: __DEV__,
});
```

`init()` validates the key (`proj_xxx` format) and throws synchronously
if it's malformed — easier to catch in development than a delayed
network error.

## Wire up the provider

`<InsitoProvider>` is the React layer that renders the survey bottom sheet. Put
it near the root of your tree. Because the sheet uses gesture-handler, the whole
app must be wrapped in a `GestureHandlerRootView`.

```tsx app/_layout.tsx theme={null}
import { GestureHandlerRootView } from "react-native-gesture-handler";
import { InsitoProvider } from "@insito/react-native";
import { Stack } from "expo-router";

export default function RootLayout() {
  return (
    <GestureHandlerRootView style={{ flex: 1 }}>
      <InsitoProvider>
        <Stack />
      </InsitoProvider>
    </GestureHandlerRootView>
  );
}
```

<Note>
  The provider is self-contained — it renders the bottom sheet with its own
  `BottomSheetModalProvider`, so you don't need to add one yourself. Just make
  sure it sits under `GestureHandlerRootView`.
</Note>

## Identify your user

Once a user signs in (or as early as you have a stable `userId`),
call `identify()`. The SDK caches identity for 24 hours so repeat
sessions are free.

```tsx theme={null}
import { useEffect } from "react";
import { MicroSurvey } from "@insito/react-native";

useEffect(() => {
  void MicroSurvey.identify({
    userId: "user-from-your-auth-system",
    platform: "ios",
    appVersion: "1.0.0",
  });
}, []);
```

See [Configure](/sdk/react-native/configure) for the full
`InsitoConfig` schema, [API reference](/sdk/react-native/api-reference)
for every method, and the [example app](https://github.com/VJiri/insito-react-native/tree/main/example)
for a working Expo Router setup.