Use flags in React Native and Expo

Read typed values

import {
  useBooleanFlag,
  useNumberFlag,
  useObjectFlag,
  useStringFlag,
} from "@superflag-sh/react-native"

const newHome = useBooleanFlag("new-home", false)
const title = useStringFlag("home-title", "Home")
const pageSize = useNumberFlag("feed-page-size", 20)
const theme = useObjectFlag("theme", { color: "violet" })

Missing identity or configuration returns the explicit fallback. Unidentified devices are not silently grouped into one shared rollout bucket.

Observe lifecycle state

import { useFlags } from "@superflag-sh/react-native"

const { status, source, stale, age, refresh } = useFlags()

Status is idle | loading | ready | refreshing | error | rate-limited and source is none | cache | network. none does not mean that remote configuration is ready. The guarded default AppState integration refreshes when the app returns to the foreground. Reconnect refresh is opt-in through an injected network adapter, so the package does not require NetInfo.

Change targeting context

<SuperflagProvider
  clientKey={clientKey}
  targetingKey={user.id}
  attributes={{ plan: user.plan, appVersion: "2.4.0" }}
>
  <App />
</SuperflagProvider>

Changing identity invalidates prior exposure correlation and evaluates the new subject independently.

Opt in to hosted telemetry

<SuperflagProvider
  clientKey={clientKey}
  targetingKey={user.id}
  telemetry={{ hosted: true }}
>
  <App />
</SuperflagProvider>

const client = useSuperflagClient()
await client.track("new-home", "home-conversion")

The AsyncStorage-backed telemetry queue is persistent, bounded, and restored defensively. Background, foreground, and injected reconnect events can flush opportunistically without blocking flag evaluation.

Use the imperative client outside React

import { createSuperflagClient } from "@superflag-sh/react-native"

const client = createSuperflagClient({
  clientKey,
  evaluationContext: { targetingKey: "install-123" },
  ttlSeconds: 60,
  onStateChange(state) {
    console.log(state.status)
  },
})

await client.initialize()

Call destroy() when the owning lifecycle ends. Most React applications should prefer the provider and hooks.

Start here

Node and server SDK

React SDK

React Native and Expo

Core SDK

CLI and agents

Feature decisions

HTTP API

Usage

Use flags in React Native and Expo

Read typed values

Observe lifecycle state

Change targeting context

Opt in to hosted telemetry

Use the imperative client outside React

​Use flags in React Native and Expo

​Read typed values

​Observe lifecycle state

​Change targeting context

​Opt in to hosted telemetry

​Use the imperative client outside React

Use flags in React Native and Expo

Read typed values

Observe lifecycle state

Change targeting context

Opt in to hosted telemetry

Use the imperative client outside React