react-native-copilot alternative

react-native-copilot popularized product tours in React Native: wrap a view in walkthroughable, describe it with CopilotStep, and start the tour from context. It was built for the old architecture, and when Fabric became the default its measurement stopped lining up for many apps: New Architecture measureLayout breakage has been open since September 2025 with users patching dist/index.js by hand in the comments, and the last release (3.3.3) shipped in December 2024.

Guideway covers the same job - spotlight, tooltip, step-by-step tours - and was written on Fabric from the first commit. If copilot broke for you after a React Native upgrade, this page is the map out.

Guideway vs react-native-copilot

Capability	Guideway	react-native-copilot
Works on the New Architecture (Fabric)	Yes	No
API style	Hooks + plain-data tours	HOC + wrapper components
Wrapper views around your elements	None (a ref)	walkthroughable + CopilotStep
Animated, reshaping spotlight (rect / rounded / circle / pill)	Yes, on the UI thread (Reanimated)	Basic
Auto-scroll to off-screen targets	Yes (ScrollView + FlatList scrollToIndex)	No
Light / dark theming built in	Yes (colorScheme, tokens)	No
Show-once persistence	Yes (pluggable storage)	No
Runs in Expo Go	Yes	-

Migrating

Copilot scatters the tour across the tree: each target is wrapped twice, and step order lives in order props. In Guideway, targets are refs and the tour is one array of data.

Before, with react-native-copilot:

const WalkthroughableText = walkthroughable(Text);

<CopilotStep text="Search your library" order={1} name="search">
  <WalkthroughableText>Search</WalkthroughableText>
</CopilotStep>

After, with Guideway:

function Screen() {
  const search = useTourTarget('search');
  return <Text ref={search}>Search</Text>;
}

const tours = [{
  id: 'main',
  steps: [{ id: 'search', title: 'Find anything', body: 'Search your library' }],
}];

The mapping:

1. CopilotProvider becomes TourProvider - mount it once, pass insets from useSafeAreaInsets().
2. Every walkthroughable(X) + CopilotStep pair becomes a single ref from useTourTarget(id) on the real element. No wrapper views, so nothing shifts in your layout.
3. name and order become the step id and its position in the steps array.
4. useCopilot().start() becomes useTour().start('main'); copilot’s events map to next, back, skip, stop on the same controller.
5. A custom tooltipComponent ports directly - Guideway accepts a global tooltipComponent or a per-step render.

Full steps live in the migration guide.

What you gain after migrating

Beyond running on Fabric: auto-scroll to targets that are off-screen, FlatList support for virtualized rows, built-in light and dark theming, an interactive spotlight users can tap through, and show-once persistence so first-run tours never nag twice.

Install

npx expo install guideway react-native-reanimated react-native-svg

Then follow the quick start - a working tour is a few lines.