@buoy-gg/route-events

Inspect observed navigation events, browse supported routes, and navigate using the parameters your app requires.

Part of Buoy — devtools that live inside your React Native app. Install it and it auto-appears in the floating menu from @buoy-gg/core.

Install

npm install @buoy-gg/core @buoy-gg/route-events

Before you start

Use a development build with @buoy-gg/core and a Free or Pro Buoy account key. From your app’s directory, sign in:

npx --package=@buoy-gg/core buoy login

For Expo, initialize Buoy before rendering the menu:

import { Buoy } from "@buoy-gg/core";

Buoy.init({ licenseKey: process.env.EXPO_PUBLIC_BUOY_KEY });

The login command writes the Expo key to .env.local. For React Native CLI, pass the key from your app’s environment configuration; React Native does not load .env.local automatically. Mount FloatingDevTools inside the same providers as your screens and restart the development server after installation. The Quick Start shows the complete root component setup.

Quick start

// app/_layout.tsx (Expo Router)
import { Slot } from "expo-router";
import { FloatingDevTools } from "@buoy-gg/core";

export default function RootLayout() {
  return (
    <>
      <Slot />
      <FloatingDevTools />
    </>
  );
}

After account setup, open Routes and navigate between two known screens. Check their paths and parameters. Keep your existing navigator and providers; supported data differs between Expo Router and React Navigation. The event duration is time since the previous navigation, not screen render time.

What you get

• Sitemap — browse discovered routes, searchable, with route types (static, dynamic, layout) labeled
• Navigate — select a supported route and supply its required parameters. App navigation guards still apply
• Live navigation stack — watch the stack push, pop, and replace as you move through the app
• Navigation event timeline — every navigation logged with path, params, timestamp, and time since the previous one
• Filtering & search — filter events by pathname pattern, search across routes
• Tracker integration — the core menu mounts the package’s route tracker
• Hooks for custom UIs — useRouteEvents, useRouteSitemap, and useNavigationStack if you want the data without the modal

Desktop & AI

To connect a React Native app to Buoy Desktop or MCP, install @buoy-gg/external-sync and follow the Desktop connection guide. Sign in to Desktop separately. MCP setup also requires a process account and Pro access. Available remote actions depend on the tool and app integration.

Account and plan requirements

Use a Free or Pro Buoy account. History limits and paid features vary by tool; see pricing. Production access requires Pro where supported. Development-only hooks and actions remain unavailable in release builds.

📚 Full docs · All Buoy tools

Proprietary software. © Buoy LLC. Terms