@buoy-gg/route-events 6.0.0 → 7.0.0

package/README.md

@@ -1,654 +1,58 @@
-# @buoy/route-events
+# @buoy-gg/route-events
 
-A comprehensive route tracking and visualization toolkit for Expo Router applications. Monitor route changes, inspect navigation state, explore your route sitemap, and visualize the navigation stack.
+[![npm version](https://img.shields.io/npm/v/@buoy-gg/route-events?style=flat-square&labelColor=1c1c1c&color=10B981)](https://www.npmjs.com/package/@buoy-gg/route-events) [![npm downloads](https://img.shields.io/npm/dm/@buoy-gg/route-events?style=flat-square&labelColor=1c1c1c&color=10B981)](https://www.npmjs.com/package/@buoy-gg/route-events)
 
-## Features
+**See every route in your app, watch navigation happen in real time, and jump to any screen from a full sitemap.**
 
-- **Route Event Tracking**: Automatically track all route changes with detailed event information
-- **Route Sitemap**: Browse all available routes in your app with search and navigation
-- **Navigation Stack Viewer**: Inspect the current navigation stack in real-time
-- **Event Timeline**: View a chronological timeline of all route changes
-- **Filtering & Search**: Filter events by pathname patterns and search through routes
-- **Persistent State**: Remembers your monitoring preferences and filters
-- **Full Modal UI**: Beautiful, production-ready modal interface for all features
+Part of [Buoy](https://github.com/Buoy-gg/buoy) — devtools that live inside your React Native app. Install it and it auto-appears in the floating menu from [`@buoy-gg/core`](https://www.npmjs.com/package/@buoy-gg/core).
 
-## Installation
+![Route Inspector demo](https://github.com/user-attachments/assets/90e55dc7-f8ab-423a-9770-84b9ff9c8446)
 
-This package is part of the React Buoy monorepo and is automatically available to other packages and the example app.
-
-For external projects:
+## Install
 
 ```bash
-npm install @buoy/route-events
-# or
-pnpm add @buoy/route-events
-# or
-yarn add @buoy/route-events
-```
-
-## Quick Start
-
-### Simplest Setup - Just 1 Line!
-
-**Import the preset and add it to your tools array. Done!**
-
-```typescript
-import { routeEventsToolPreset } from '@buoy/route-events';
-import { FloatingDevTools } from '@buoy/core';
-
-const installedApps = [
-  routeEventsToolPreset, // That's it! One line.
-  // ...your other tools
-];
-
-function App() {
-  return (
-    <FloatingDevTools
-      apps={installedApps}
-      environment="local"
-      userRole="admin"
-    />
-  );
-}
+npm install @buoy-gg/core @buoy-gg/route-events
 ```
 
-**Done!** The preset automatically:
-- ✅ Starts tracking routes when opened
-- ✅ Uses the built-in route observer singleton
-- ✅ Provides all three tabs (Routes, Events, Stack)
-- ✅ No configuration, no props, no hooks to call
-
-## Requirements
+## Quick start
 
-`@buoy/route-events` relies on the same core libraries as Expo Router itself:
-
-- `expo-router` ≥ 2.0.0 (the Routes tab reads `store.routeNode` directly)
-- `@react-navigation/native` ≥ 7.x (Stack tab + Expo Router routing hooks)
-- `@react-native-async-storage/async-storage` (state persistence)
-- `react` / `react-native`
-
-These packages are declared as `peerDependencies`, so your app decides the exact versions. When a dependency is missing or not initialized, the devtool logs a clear `[RouteEvents] ...` console message (in dev builds) and gracefully disables the affected feature instead of crashing. See `packages/route-events/docs/ROUTES_SITEMAP_ACCESS_GUIDE.md` for the full data-flow and troubleshooting guide.
-
-### Alternative: Manual Setup
-
-If you're not using FloatingDevTools or want more control:
-
-```typescript
-import { RouteEventsModalWithTabs } from '@buoy/route-events';
-
-function App() {
-  const [showRoutes, setShowRoutes] = useState(false);
+```tsx
+// app/_layout.tsx (Expo Router)
+import { Slot } from "expo-router";
+import { FloatingDevTools } from "@buoy-gg/core";
 
+export default function RootLayout() {
   return (
     <>
-      <Button onPress={() => setShowRoutes(true)}>
-        Open Route Inspector
-      </Button>
-
-      <RouteEventsModalWithTabs
-        visible={showRoutes}
-        onClose={() => setShowRoutes(false)}
-      />
+      <Slot />
+      <FloatingDevTools />
     </>
   );
 }
 ```
 
-## API Reference
-
-### Core Components
-
-#### `RouteEventsModalWithTabs`
-
-The main modal interface with three tabs: Routes, Events, and Stack.
-
-**Props:**
-
-```typescript
-interface RouteEventsModalWithTabsProps {
-  /** Whether the modal is visible */
-  visible: boolean;
-  /** Callback when modal is closed */
-  onClose: () => void;
-  /** Optional back button handler */
-  onBack?: () => void;
-  /** Whether to use shared modal dimensions */
-  enableSharedModalDimensions?: boolean;
-  /** 
-   * Optional route observer instance. 
-   * If not provided, uses the default singleton (recommended).
-   * Route tracking starts automatically when the modal is opened.
-   */
-  routeObserver?: RouteObserver;
-}
-```
-
-**Example:**
-
-```typescript
-<RouteEventsModalWithTabs
-  visible={isVisible}
-  onClose={handleClose}
-/>
-```
-
-**Advanced Example (with custom observer):**
-
-Only needed if you want to use a custom route observer instance:
-
-```typescript
-import { RouteEventsModalWithTabs, routeObserver } from '@buoy/route-events';
-
-<RouteEventsModalWithTabs
-  visible={isVisible}
-  onClose={handleClose}
-  routeObserver={routeObserver} // Optional - uses default if not provided
-/>
-```
-
-#### `RoutesSitemap`
-
-Standalone component for browsing all routes in your application.
-
-**Props:**
-
-```typescript
-interface RoutesSitemapProps {
-  style?: StyleProp<ViewStyle>;
-}
-```
-
-**Example:**
-
-```typescript
-import { RoutesSitemap } from '@buoy/route-events';
-
-function RoutesScreen() {
-  return <RoutesSitemap />;
-}
-```
-
-#### `NavigationStack`
-
-Standalone component for visualizing the current navigation stack.
-
-**Props:**
-
-```typescript
-interface NavigationStackProps {
-  style?: StyleProp<ViewStyle>;
-}
-```
-
-**Example:**
-
-```typescript
-import { NavigationStack } from '@buoy/route-events';
-
-function DebugScreen() {
-  return <NavigationStack />;
-}
-```
-
-### Hooks
-
-#### `useRouteObserver`
-
-Hook to track route changes and emit events to the global observer.
-
-**Note:** You typically don't need to use this hook directly - the `RouteEventsModalWithTabs` component starts tracking automatically. This hook is only needed for advanced use cases like custom analytics.
-
-**Signature:**
-
-```typescript
-function useRouteObserver(
-  callback?: (event: RouteChangeEvent) => void
-): void
-```
-
-**Examples:**
-
-```typescript
-// Only needed for custom analytics - modal handles tracking automatically!
-import { useRouteObserver } from '@buoy/route-events';
-
-export default function RootLayout() {
-  useRouteObserver((event) => {
-    analytics.trackPageView(event.pathname);
-  });
-
-  return <Stack />;
-}
-```
-
-#### `useRouteSitemap`
-
-Access route information from your app's file-based routing structure.
-
-**Signature:**
-
-```typescript
-function useRouteSitemap(
-  options?: UseRouteSitemapOptions
-): UseRouteSitemapResult
-```
-
-**Options:**
-
-```typescript
-interface UseRouteSitemapOptions {
-  /** Whether to include layout routes */
-  includeLayouts?: boolean;
-  /** Whether to include route groups */
-  includeGroups?: boolean;
-}
-```
-
-**Result:**
-
-```typescript
-interface UseRouteSitemapResult {
-  /** All routes in the application */
-  routes: RouteInfo[];
-  /** Routes grouped by directory */
-  groups: RouteGroup[];
-  /** Statistics about the routes */
-  stats: RouteStats;
-  /** Get a specific route by path */
-  getRoute: (path: string) => RouteInfo | undefined;
-  /** Get all parent routes of a path */
-  getParents: (path: string) => RouteInfo[];
-}
-```
-
-**Example:**
-
-```typescript
-import { useRouteSitemap } from '@buoy/route-events';
-
-function RouteDebugger() {
-  const { routes, stats, getRoute } = useRouteSitemap();
-
-  console.log(`Total routes: ${stats.total}`);
-  console.log(`Dynamic routes: ${stats.byType.dynamic}`);
-  
-  const homeRoute = getRoute('/');
-  // { path: '/', type: 'index', ... }
-
-  return (
-    <View>
-      {routes.map(route => (
-        <Text key={route.path}>{route.path}</Text>
-      ))}
-    </View>
-  );
-}
-```
-
-#### `useNavigationStack`
-
-Access and control the current navigation stack.
+That's it. `FloatingDevTools` detects the package, mounts the route tracker for you, and the ROUTES tool shows up in the menu. It auto-detects whether you're on Expo Router or React Navigation and adapts.
 
-**Signature:**
+## What you get
 
-```typescript
-function useNavigationStack(): UseNavigationStackResult
-```
+- **Full sitemap** — browse every route in your app, searchable, with route types (static, dynamic, layout) labeled
+- **Jump to any screen** — tap a route in the sitemap and navigate straight to it, params and all
+- **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
+- **Zero setup** — no `<RouteTracker />` to place, no config; the core menu wires it automatically
+- **Hooks for custom UIs** — `useRouteEvents`, `useRouteSitemap`, and `useNavigationStack` if you want the data without the modal
 
-**Result:**
-
-```typescript
-interface UseNavigationStackResult {
-  /** The current navigation stack */
-  stack: StackDisplayItem[];
-  /** Whether the data is loading */
-  loading: boolean;
-  /** Navigate to a specific stack index */
-  navigateToIndex: (index: number) => void;
-  /** Pop back to a specific index */
-  popToIndex: (index: number) => void;
-  /** Go back one screen */
-  goBack: () => void;
-  /** Go to the root of the stack */
-  popToTop: () => void;
-}
-```
-
-**Example:**
-
-```typescript
-import { useNavigationStack } from '@buoy/route-events';
-
-function NavigationDebugger() {
-  const { stack, goBack, popToTop } = useNavigationStack();
-
-  return (
-    <View>
-      <Text>Stack Depth: {stack.length}</Text>
-      <Button onPress={goBack}>Go Back</Button>
-      <Button onPress={popToTop}>Go to Root</Button>
-      
-      {stack.map((item, index) => (
-        <Text key={item.key}>
-          {index}: {item.displayPath}
-        </Text>
-      ))}
-    </View>
-  );
-}
-```
-
-### Utilities
-
-#### `RouteObserver`
-
-Singleton instance for observing route changes.
-
-**Methods:**
-
-```typescript
-class RouteObserver {
-  /** Emit a route change event */
-  emit(event: RouteChangeEvent): void;
-  
-  /** Add a listener for route changes */
-  addListener(callback: (event: RouteChangeEvent) => void): () => void;
-  
-  /** Remove a listener */
-  removeListener(callback: (event: RouteChangeEvent) => void): void;
-}
-```
-
-**Example:**
-
-```typescript
-import { routeObserver } from '@buoy/route-events';
-
-// Add listener
-const unsubscribe = routeObserver.addListener((event) => {
-  console.log('Route changed:', event.pathname);
-});
-
-// Later, remove listener
-unsubscribe();
-```
-
-#### `RouteParser`
-
-Utility for parsing Expo Router's route structure.
-
-**Methods:**
-
-```typescript
-class RouteParser {
-  /** Get all routes from the router */
-  static getRoutes(options?: {
-    includeLayouts?: boolean;
-    includeGroups?: boolean;
-  }): RouteInfo[];
-  
-  /** Group routes by directory */
-  static groupRoutes(routes: RouteInfo[]): RouteGroup[];
-  
-  /** Get statistics about routes */
-  static getStats(routes: RouteInfo[]): RouteStats;
-}
-```
-
-### Types
-
-#### `RouteChangeEvent`
-
-```typescript
-interface RouteChangeEvent {
-  /** Current pathname */
-  pathname: string;
-  /** Route parameters */
-  params: Record<string, string | string[]>;
-  /** Route segments */
-  segments: string[];
-  /** Timestamp of the change */
-  timestamp: number;
-  /** Previous pathname (if available) */
-  previousPathname?: string;
-  /** Time since previous navigation in ms */
-  timeSincePrevious?: number;
-}
-```
-
-#### `RouteInfo`
-
-```typescript
-interface RouteInfo {
-  /** Full path of the route */
-  path: string;
-  /** Route type */
-  type: RouteType;
-  /** Route name/file */
-  name: string;
-  /** Dynamic parameters */
-  params: string[];
-  /** Whether it's a layout */
-  isLayout: boolean;
-  /** Whether it's a route group */
-  isGroup: boolean;
-  /** Parent path */
-  parent?: string;
-}
-```
-
-#### `RouteType`
-
-```typescript
-type RouteType =
-  | 'index'      // index routes (/)
-  | 'static'     // static routes (/about)
-  | 'dynamic'    // dynamic routes (/user/[id])
-  | 'catch-all'  // catch-all routes (/docs/[...path])
-  | 'layout'     // layout routes (_layout.tsx)
-  | 'group';     // route groups ((tabs))
-```
-
-## Use Cases
-
-### Analytics Integration
-
-```typescript
-import { useRouteObserver } from '@buoy/route-events';
-
-export default function RootLayout() {
-  useRouteObserver((event) => {
-    // Track page views
-    analytics.trackPageView({
-      path: event.pathname,
-      params: event.params,
-      previousPath: event.previousPathname,
-      timeSpent: event.timeSincePrevious,
-    });
-  });
-
-  return <Stack />;
-}
-```
-
-### Performance Monitoring
-
-```typescript
-import { useRouteObserver } from '@buoy/route-events';
-
-export default function RootLayout() {
-  useRouteObserver((event) => {
-    if (event.timeSincePrevious && event.timeSincePrevious > 1000) {
-      // Log slow navigations
-      console.warn('Slow navigation:', {
-        from: event.previousPathname,
-        to: event.pathname,
-        duration: event.timeSincePrevious,
-      });
-    }
-  });
-
-  return <Stack />;
-}
-```
-
-### Development Tools
-
-```typescript
-import { RouteEventsModalWithTabs, routeObserver } from '@buoy/route-events';
-
-function DevTools() {
-  const [visible, setVisible] = useState(false);
-  
-  // Only show in development
-  if (__DEV__) {
-    return (
-      <>
-        <TouchableOpacity 
-          style={styles.devButton}
-          onPress={() => setVisible(true)}
-        >
-          <Text>🧭 Routes</Text>
-        </TouchableOpacity>
-        
-        <RouteEventsModalWithTabs
-          visible={visible}
-          onClose={() => setVisible(false)}
-          routeObserver={routeObserver}
-        />
-      </>
-    );
-  }
-  
-  return null;
-}
-```
-
-### Route Documentation
-
-```typescript
-import { useRouteSitemap } from '@buoy/route-events';
-
-function RouteDocumentation() {
-  const { routes, groups, stats } = useRouteSitemap({
-    includeLayouts: false,
-    includeGroups: false,
-  });
-
-  return (
-    <ScrollView>
-      <Text>Total Routes: {stats.total}</Text>
-      
-      {groups.map(group => (
-        <View key={group.name}>
-          <Text>{group.name} ({group.routes.length})</Text>
-          {group.routes.map(route => (
-            <Text key={route.path}>
-              {route.path} - {route.type}
-            </Text>
-          ))}
-        </View>
-      ))}
-    </ScrollView>
-  );
-}
-```
-
-## Features in Detail
-
-### Routes Tab
-
-- Browse all routes in your application
-- Search routes by path or name
-- View route types (static, dynamic, catch-all)
-- Navigate to any route directly
-- Handles dynamic route parameters with prompts
-- Group and layout route identification
-
-### Events Tab
-
-- Real-time route change monitoring
-- Toggle monitoring on/off
-- Event timeline with timestamps
-- Filter events by pathname patterns
-- Search through event history
-- View detailed event information
-- Compare route changes (diff view)
-- Clear event history
-- Persistent filter preferences
-
-### Stack Tab
-
-- Real-time navigation stack visualization
-- Stack depth indicator
-- Navigate to any stack level
-- Pop to specific stack index
-- Quick navigation controls
-- Route parameter display
-
-## Dependencies
-
-- `@buoy/shared-ui` - Common UI components and utilities
-- `expo-router` - Expo Router integration (peer dependency)
-- `@react-navigation/native` - React Navigation integration (peer dependency)
-- `@react-native-async-storage/async-storage` - For persistent preferences (peer dependency)
-- React and React Native (peer dependencies)
-
-## Development
-
-### Building
-
-```bash
-pnpm build
-```
-
-### Type Checking
-
-```bash
-pnpm typecheck
-```
-
-### Clean Build
-
-```bash
-pnpm clean
-```
-
-## Package Structure
-
-```
-route-events/
-├── src/
-│   ├── components/           # UI components
-│   │   ├── RouteEventsModalWithTabs.tsx
-│   │   ├── RoutesSitemap.tsx
-│   │   ├── NavigationStack.tsx
-│   │   ├── RouteEventsTimeline.tsx
-│   │   ├── RouteEventItemCompact.tsx
-│   │   ├── RouteEventDetailContent.tsx
-│   │   ├── RouteEventExpandedContent.tsx
-│   │   └── RouteFilterViewV2.tsx
-│   ├── RouteObserver.ts     # Event system
-│   ├── RouteParser.ts       # Route parsing utilities
-│   ├── useRouteObserver.ts  # Route tracking hook
-│   ├── useRouteSitemap.ts   # Sitemap access hook
-│   ├── useNavigationStack.ts # Stack access hook
-│   └── index.tsx            # Main exports
-├── lib/                     # Built output (git ignored)
-├── package.json
-├── tsconfig.json
-├── tsconfig.build.json
-└── README.md
-```
+## Desktop & AI
 
-## License
+The same live session streams to [Buoy Desktop](https://github.com/Buoy-gg/Buoy-Desktop) (free, macOS/Windows/Linux) and to Claude Code or Cursor via the [Buoy MCP server](https://buoy.gg/buoy/latest/docs/mcp).
 
-MIT
+## Free vs Pro
 
-## Contributing
+Every tool is free. [Pro](https://buoy.gg/pricing) unlocks production builds, the MCP server, and unlimited capture. Every weekend, Pro features unlock free for everyone.
 
-See the main repository [CONTRIBUTING.md](../../CONTRIBUTING.md) for contribution guidelines.
+---
 
-## Support
+📚 [Full docs](https://buoy.gg/buoy/latest/docs/tools/routes) · [All Buoy tools](https://github.com/Buoy-gg/buoy)
 
-For issues and feature requests, please visit the [GitHub repository](https://github.com/LovesWorking/react-native-buoy/issues).
+Proprietary software. © Buoy LLC. [Terms](https://buoy.gg/terms)

package/lib/commonjs/components/ReactNavigationRoutes.js

@@ -6,8 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.ReactNavigationRoutes = ReactNavigationRoutes;
 var _react = require("react");
 var _reactNative = require("react-native");
-var _native = require("@react-navigation/native");
-var _core = require("@react-navigation/core");
+var _safeReactNavigation = require("../utils/safeReactNavigation");
 var _sharedUi = require("@buoy-gg/shared-ui");
 var _license = require("@buoy-gg/license");
 var _jsxRuntime = require("react/jsx-runtime");
@@ -21,6 +20,12 @@ var _jsxRuntime = require("react/jsx-runtime");
  * Provides navigation to any discovered screen using nested screen/params actions.
  */
 
+// Resolved once at module load; null when @react-navigation/native is absent
+// (the fallback context then yields an undefined containerRef, so the
+// dispatch paths below never execute).
+const CommonActions = (0, _safeReactNavigation.getCommonActions)();
+const NavigationContainerRefContext = (0, _safeReactNavigation.getNavigationContainerRefContext)();
+
 // ============================================================================
 // Types
 // ============================================================================
@@ -94,7 +99,7 @@ function findScreenPath(state, screenName) {
 function buildNestedNavigateAction(path) {
   if (path.length === 0) return null;
   if (path.length === 1) {
-    return _native.CommonActions.navigate({
+    return CommonActions.navigate({
       name: path[0]
     });
   }
@@ -107,7 +112,7 @@ function buildNestedNavigateAction(path) {
       params
     };
   }
-  return _native.CommonActions.navigate({
+  return CommonActions.navigate({
     name: path[0],
     params
   });
@@ -120,7 +125,7 @@ function buildNestedNavigateAction(path) {
 function ReactNavigationRoutes({
   style
 }) {
-  const containerRef = (0, _react.useContext)(_core.NavigationContainerRefContext);
+  const containerRef = (0, _react.useContext)(NavigationContainerRefContext);
   const [navigationState, setNavigationState] = (0, _react.useState)(() => containerRef?.getRootState?.() ?? null);
   const [searchQuery, setSearchQuery] = (0, _react.useState)("");
   const [isSearching, setIsSearching] = (0, _react.useState)(false);
@@ -241,7 +246,7 @@ function ReactNavigationRoutes({
         }
       }
       // Fallback
-      containerRef.dispatch(_native.CommonActions.navigate({
+      containerRef.dispatch(CommonActions.navigate({
         name: screenName
       }));
     } catch (error) {

package/lib/commonjs/components/RouteEventsModalWithTabs.js

@@ -6,8 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.RouteEventsModalWithTabs = RouteEventsModalWithTabs;
 var _react = require("react");
 var _reactNative = require("react-native");
-var _native = require("@react-navigation/native");
-var _core = require("@react-navigation/core");
+var _safeReactNavigation = require("../utils/safeReactNavigation");
 var _sharedUi = require("@buoy-gg/shared-ui");
 var _license = require("@buoy-gg/license");
 var _useRouteEvents = require("../hooks/useRouteEvents");
@@ -17,6 +16,11 @@ var _ReactNavigationRoutes = require("./ReactNavigationRoutes");
 var _NavigationStack = require("./NavigationStack");
 var _RouteEventsTimeline = require("./RouteEventsTimeline");
 var _jsxRuntime = require("react/jsx-runtime");
+// Resolved once at module load; null when @react-navigation/native is absent
+// (the fallback context then yields an undefined containerRef, so the
+// dispatch paths below never execute).
+const CommonActions = (0, _safeReactNavigation.getCommonActions)();
+const NavigationContainerRefContext = (0, _safeReactNavigation.getNavigationContainerRefContext)();
 // Free tier limit for route events
 const FREE_TIER_EVENT_LIMIT = 3;
 /**
@@ -47,7 +51,7 @@ function findScreenPath(state, screenName) {
 function buildNestedNavigateAction(path) {
   if (path.length === 0) return null;
   if (path.length === 1) {
-    return _native.CommonActions.navigate({
+    return CommonActions.navigate({
       name: path[0]
     });
   }
@@ -62,7 +66,7 @@ function buildNestedNavigateAction(path) {
       params
     };
   }
-  return _native.CommonActions.navigate({
+  return CommonActions.navigate({
     name: path[0],
     params
   });
@@ -75,7 +79,7 @@ function RouteEventsModalWithTabs({
   enableSharedModalDimensions = false
 }) {
   const router = (0, _sharedUi.useSafeRouter)();
-  const containerRef = (0, _react.useContext)(_core.NavigationContainerRefContext);
+  const containerRef = (0, _react.useContext)(NavigationContainerRefContext);
   const hasExpoRouter = (0, _sharedUi.isExpoRouterAvailable)();
   const [activeTab, setActiveTab] = (0, _react.useState)("events");
   const [showUpgradeModal, setShowUpgradeModal] = (0, _react.useState)(false);
@@ -144,7 +148,7 @@ function RouteEventsModalWithTabs({
         }
 
         // Fallback: try direct navigation (works for top-level screens)
-        containerRef.dispatch(_native.CommonActions.navigate({
+        containerRef.dispatch(CommonActions.navigate({
           name: screenName
         }));
       }

package/lib/commonjs/useNavigationStack.js

@@ -5,8 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.useNavigationStack = useNavigationStack;
 var _react = require("react");
-var _native = require("@react-navigation/native");
-var _core = require("@react-navigation/core");
+var _safeReactNavigation = require("./utils/safeReactNavigation");
 var _sharedUi = require("@buoy-gg/shared-ui");
 /**
  * useNavigationStack - Hook to access current navigation stack state
@@ -20,6 +19,13 @@ var _sharedUi = require("@buoy-gg/shared-ui");
  * - RN CLI: uses NavigationContainerRefContext (works as sibling of navigators)
  */
 
+// Resolved once at module load; null when @react-navigation/native is absent
+// (the fallback context then yields an undefined containerRef, so the
+// dispatch paths below never execute).
+const CommonActions = (0, _safeReactNavigation.getCommonActions)();
+const StackActions = (0, _safeReactNavigation.getStackActions)();
+const NavigationContainerRefContext = (0, _safeReactNavigation.getNavigationContainerRefContext)();
+
 // ============================================================================
 // Type Definitions
 // ============================================================================
@@ -56,7 +62,7 @@ function findScreenPath(state, screenName) {
 function buildNestedNavigateAction(path) {
   if (path.length === 0) return null;
   if (path.length === 1) {
-    return _native.CommonActions.navigate({
+    return CommonActions.navigate({
       name: path[0]
     });
   }
@@ -69,7 +75,7 @@ function buildNestedNavigateAction(path) {
       params
     };
   }
-  return _native.CommonActions.navigate({
+  return CommonActions.navigate({
     name: path[0],
     params
   });
@@ -196,7 +202,7 @@ function buildStack(navigationState, isExpo) {
  */
 function useNavigationStack() {
   const isExpo = (0, _sharedUi.isExpoRouterAvailable)();
-  const containerRef = (0, _react.useContext)(_core.NavigationContainerRefContext);
+  const containerRef = (0, _react.useContext)(NavigationContainerRefContext);
   const [navigationState, setNavigationState] = (0, _react.useState)(() => containerRef?.getRootState?.() ?? null);
   const [isLoaded, setIsLoaded] = (0, _react.useState)(false);
   const [error, setError] = (0, _react.useState)(null);
@@ -268,7 +274,7 @@ function useNavigationStack() {
           }
         }
         // Fallback: try direct navigation
-        containerRef.dispatch(_native.CommonActions.navigate({
+        containerRef.dispatch(CommonActions.navigate({
           name: targetRoute.name,
           params: targetRoute.params
         }));
@@ -289,7 +295,7 @@ function useNavigationStack() {
           expoRouter.back();
         }
       } else if (containerRef) {
-        containerRef.dispatch(_native.StackActions.pop(popCount));
+        containerRef.dispatch(StackActions.pop(popCount));
       }
     } catch (err) {
       console.error("Failed to pop:", err);
@@ -316,7 +322,7 @@ function useNavigationStack() {
         // Pop to index 0 via expo-router
         popToIndex(0);
       } else if (containerRef) {
-        containerRef.dispatch(_native.StackActions.popToTop());
+        containerRef.dispatch(StackActions.popToTop());
       }
     } catch (err) {
       console.error("Failed to pop to top:", err);

package/lib/commonjs/useRouteObserverReactNavigation.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.useRouteObserverReactNavigation = useRouteObserverReactNavigation;
 var _react = require("react");
-var _core = require("@react-navigation/core");
+var _safeReactNavigation = require("./utils/safeReactNavigation");
 var _RouteObserver = require("./RouteObserver");
 /**
  * useRouteObserverReactNavigation - React hook for observing route changes
@@ -18,6 +18,10 @@ var _RouteObserver = require("./RouteObserver");
  * a NavigationContainer — does NOT need to be inside a navigator.
  */
 
+// Resolved once at module load; falls back to an always-undefined context
+// when @react-navigation/native is absent, so the effect below no-ops.
+const NavigationContainerRefContext = (0, _safeReactNavigation.getNavigationContainerRefContext)();
+
 /**
  * Walk a React Navigation state tree to find the deepest focused route.
  * Returns the route object and the array of route names from root to leaf.
@@ -81,7 +85,7 @@ function emitRouteEvent(state, previousPathnameRef, previousTimestampRef, callba
  * Works anywhere inside a NavigationContainer (does not need to be inside a navigator).
  */
 function useRouteObserverReactNavigation(callback) {
-  const containerRef = (0, _react.useContext)(_core.NavigationContainerRefContext);
+  const containerRef = (0, _react.useContext)(NavigationContainerRefContext);
   const callbackRef = (0, _react.useRef)(callback);
   const previousPathnameRef = (0, _react.useRef)(undefined);
   const previousTimestampRef = (0, _react.useRef)(undefined);

package/lib/commonjs/utils/safeReactNavigation.js

@@ -3,6 +3,9 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.getCommonActions = getCommonActions;
+exports.getNavigationContainerRefContext = getNavigationContainerRefContext;
+exports.getStackActions = getStackActions;
 exports.isReactNavigationAvailable = isReactNavigationAvailable;
 exports.useSafeNavigation = useSafeNavigation;
 exports.useSafeNavigationState = useSafeNavigationState;
@@ -95,6 +98,37 @@ function useSafeNavigationState(selector) {
   }
 }
 
+// ============================================================================
+// Guarded module accessors
+// ============================================================================
+
+/**
+ * Fallback for useContext when @react-navigation/native is absent: a stable
+ * context that always yields undefined, so callers' `if (!containerRef)`
+ * guards skip every dispatch path. Module presence is constant for the app
+ * lifetime, so hook order stays stable either way.
+ */
+const FallbackNavigationContainerRefContext = /*#__PURE__*/(0, _react.createContext)(undefined);
+
+/** CommonActions from @react-navigation/native, or null when absent. */
+function getCommonActions() {
+  return checkReactNavigationAvailability() ? reactNavigation.CommonActions : null;
+}
+
+/** StackActions from @react-navigation/native, or null when absent. */
+function getStackActions() {
+  return checkReactNavigationAvailability() ? reactNavigation.StackActions : null;
+}
+
+/**
+ * NavigationContainerRefContext, read via @react-navigation/native's
+ * re-export (never from @react-navigation/core directly — core is not a
+ * declared dependency). Falls back to an always-undefined context.
+ */
+function getNavigationContainerRefContext() {
+  return checkReactNavigationAvailability() && reactNavigation.NavigationContainerRefContext ? reactNavigation.NavigationContainerRefContext : FallbackNavigationContainerRefContext;
+}
+
 // ============================================================================
 // Availability check
 // ============================================================================

package/lib/module/components/ReactNavigationRoutes.js

@@ -12,8 +12,13 @@
 
 import { useState, useCallback, useMemo, useEffect, useContext } from "react";
 import { View, Text, TextInput, TouchableOpacity, ScrollView, StyleSheet, Alert } from "react-native";
-import { CommonActions } from "@react-navigation/native";
-import { NavigationContainerRefContext } from "@react-navigation/core";
+import { getCommonActions, getNavigationContainerRefContext } from "../utils/safeReactNavigation";
+
+// Resolved once at module load; null when @react-navigation/native is absent
+// (the fallback context then yields an undefined containerRef, so the
+// dispatch paths below never execute).
+const CommonActions = getCommonActions();
+const NavigationContainerRefContext = getNavigationContainerRefContext();
 import { Search, ChevronDown, ChevronRight, InlineCopyButton, ToolbarCopyButton, RefreshCw, ProUpgradeModal, buoyColors } from "@buoy-gg/shared-ui";
 import { useIsPro } from "@buoy-gg/license";
 

package/lib/module/components/RouteEventsModalWithTabs.js

@@ -2,8 +2,13 @@
 
 import { useState, useCallback, useContext, useEffect, useRef, useMemo } from "react";
 import { Text, View, TouchableOpacity, StyleSheet, Alert } from "react-native";
-import { CommonActions } from "@react-navigation/native";
-import { NavigationContainerRefContext } from "@react-navigation/core";
+import { getCommonActions, getNavigationContainerRefContext } from "../utils/safeReactNavigation";
+
+// Resolved once at module load; null when @react-navigation/native is absent
+// (the fallback context then yields an undefined containerRef, so the
+// dispatch paths below never execute).
+const CommonActions = getCommonActions();
+const NavigationContainerRefContext = getNavigationContainerRefContext();
 import { useSafeRouter, isExpoRouterAvailable } from "@buoy-gg/shared-ui";
 import { JsModal, ModalHeader, TabSelector, formatRelativeTime, devToolsStorageKeys, Navigation, Trash2, Filter, SearchBar, persistentStorage, ToolbarCopyButton, Lock, ProUpgradeModal, PowerToggleButton, buoyColors, TickProvider } from "@buoy-gg/shared-ui";
 import { useIsPro } from "@buoy-gg/license";

package/lib/module/useNavigationStack.js

@@ -13,10 +13,16 @@
  */
 
 import { useState, useContext, useEffect, useMemo, useCallback } from "react";
-import { CommonActions, StackActions } from "@react-navigation/native";
-import { NavigationContainerRefContext } from "@react-navigation/core";
+import { getCommonActions, getStackActions, getNavigationContainerRefContext } from "./utils/safeReactNavigation";
 import { getSafeRouter, isExpoRouterAvailable } from "@buoy-gg/shared-ui";
 
+// Resolved once at module load; null when @react-navigation/native is absent
+// (the fallback context then yields an undefined containerRef, so the
+// dispatch paths below never execute).
+const CommonActions = getCommonActions();
+const StackActions = getStackActions();
+const NavigationContainerRefContext = getNavigationContainerRefContext();
+
 // ============================================================================
 // Type Definitions
 // ============================================================================

package/lib/module/useRouteObserverReactNavigation.js

@@ -12,9 +12,13 @@
  */
 
 import { useContext, useEffect, useRef } from "react";
-import { NavigationContainerRefContext } from "@react-navigation/core";
+import { getNavigationContainerRefContext } from "./utils/safeReactNavigation";
 import { routeObserver } from "./RouteObserver";
 
+// Resolved once at module load; falls back to an always-undefined context
+// when @react-navigation/native is absent, so the effect below no-ops.
+const NavigationContainerRefContext = getNavigationContainerRefContext();
+
 /**
  * Walk a React Navigation state tree to find the deepest focused route.
  * Returns the route object and the array of route names from root to leaf.

package/lib/module/utils/safeReactNavigation.js

@@ -7,7 +7,7 @@
  * Falls back to no-op implementations when @react-navigation/native is not installed.
  */
 
-import { useMemo } from "react";
+import { createContext, useMemo } from "react";
 let reactNavigation = null;
 let isAvailable = false;
 let checkedAvailability = false;
@@ -89,6 +89,37 @@ export function useSafeNavigationState(selector) {
   }
 }
 
+// ============================================================================
+// Guarded module accessors
+// ============================================================================
+
+/**
+ * Fallback for useContext when @react-navigation/native is absent: a stable
+ * context that always yields undefined, so callers' `if (!containerRef)`
+ * guards skip every dispatch path. Module presence is constant for the app
+ * lifetime, so hook order stays stable either way.
+ */
+const FallbackNavigationContainerRefContext = /*#__PURE__*/createContext(undefined);
+
+/** CommonActions from @react-navigation/native, or null when absent. */
+export function getCommonActions() {
+  return checkReactNavigationAvailability() ? reactNavigation.CommonActions : null;
+}
+
+/** StackActions from @react-navigation/native, or null when absent. */
+export function getStackActions() {
+  return checkReactNavigationAvailability() ? reactNavigation.StackActions : null;
+}
+
+/**
+ * NavigationContainerRefContext, read via @react-navigation/native's
+ * re-export (never from @react-navigation/core directly — core is not a
+ * declared dependency). Falls back to an always-undefined context.
+ */
+export function getNavigationContainerRefContext() {
+  return checkReactNavigationAvailability() && reactNavigation.NavigationContainerRefContext ? reactNavigation.NavigationContainerRefContext : FallbackNavigationContainerRefContext;
+}
+
 // ============================================================================
 // Availability check
 // ============================================================================

package/lib/typescript/components/ReactNavigationRoutes.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ReactNavigationRoutes.d.ts","sourceRoot":"","sources":["../../../src/components/ReactNavigationRoutes.tsx"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AA8BH,MAAM,WAAW,0BAA0B;IACzC,KAAK,CAAC,EAAE,GAAG,CAAC;CACb;AAkHD,wBAAgB,qBAAqB,CAAC,EAAE,KAAK,EAAE,EAAE,0BAA0B,+BAmS1E"}
+{"version":3,"file":"ReactNavigationRoutes.d.ts","sourceRoot":"","sources":["../../../src/components/ReactNavigationRoutes.tsx"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAsCH,MAAM,WAAW,0BAA0B;IACzC,KAAK,CAAC,EAAE,GAAG,CAAC;CACb;AAkHD,wBAAgB,qBAAqB,CAAC,EAAE,KAAK,EAAE,EAAE,0BAA0B,+BAmS1E"}

package/lib/typescript/components/RouteEventsModalWithTabs.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RouteEventsModalWithTabs.d.ts","sourceRoot":"","sources":["../../../src/components/RouteEventsModalWithTabs.tsx"],"names":[],"mappings":"AAqDA,MAAM,WAAW,6BAA6B;IAC5C,OAAO,EAAE,OAAO,CAAC;IACjB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,UAAU,CAAC,EAAE,CAAC,UAAU,EAAE,GAAG,KAAK,IAAI,CAAC;IACvC,2BAA2B,CAAC,EAAE,OAAO,CAAC;CACvC;AA8CD,wBAAgB,wBAAwB,CAAC,EACvC,OAAO,EACP,OAAO,EACP,MAAM,EACN,UAAU,EACV,2BAAmC,GACpC,EAAE,6BAA6B,sCA8iB/B"}
+{"version":3,"file":"RouteEventsModalWithTabs.d.ts","sourceRoot":"","sources":["../../../src/components/RouteEventsModalWithTabs.tsx"],"names":[],"mappings":"AA6DA,MAAM,WAAW,6BAA6B;IAC5C,OAAO,EAAE,OAAO,CAAC;IACjB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,UAAU,CAAC,EAAE,CAAC,UAAU,EAAE,GAAG,KAAK,IAAI,CAAC;IACvC,2BAA2B,CAAC,EAAE,OAAO,CAAC;CACvC;AA8CD,wBAAgB,wBAAwB,CAAC,EACvC,OAAO,EACP,OAAO,EACP,MAAM,EACN,UAAU,EACV,2BAAmC,GACpC,EAAE,6BAA6B,sCA8iB/B"}

package/lib/typescript/useNavigationStack.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useNavigationStack.d.ts","sourceRoot":"","sources":["../../src/useNavigationStack.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAsBH,MAAM,WAAW,gBAAgB;IAC/B,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAC5B,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,OAAO,CAAC;CACjB;AAED,MAAM,WAAW,wBAAwB;IAEvC,KAAK,EAAE,gBAAgB,EAAE,CAAC;IAC1B,YAAY,EAAE,gBAAgB,GAAG,IAAI,CAAC;IACtC,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,OAAO,CAAC;IAGlB,QAAQ,EAAE,OAAO,CAAC;IAClB,KAAK,EAAE,KAAK,GAAG,IAAI,CAAC;IAGpB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,eAAe,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,UAAU,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,QAAQ,EAAE,MAAM,IAAI,CAAC;CACtB;AAuKD;;;;;;;;;;;;;;;;;;GAkBG;AACH,wBAAgB,kBAAkB,IAAI,wBAAwB,CAqK7D"}
+{"version":3,"file":"useNavigationStack.d.ts","sourceRoot":"","sources":["../../src/useNavigationStack.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AA6BH,MAAM,WAAW,gBAAgB;IAC/B,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAC5B,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,OAAO,CAAC;CACjB;AAED,MAAM,WAAW,wBAAwB;IAEvC,KAAK,EAAE,gBAAgB,EAAE,CAAC;IAC1B,YAAY,EAAE,gBAAgB,GAAG,IAAI,CAAC;IACtC,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,OAAO,CAAC;IAGlB,QAAQ,EAAE,OAAO,CAAC;IAClB,KAAK,EAAE,KAAK,GAAG,IAAI,CAAC;IAGpB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,eAAe,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,UAAU,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,QAAQ,EAAE,MAAM,IAAI,CAAC;CACtB;AAuKD;;;;;;;;;;;;;;;;;;GAkBG;AACH,wBAAgB,kBAAkB,IAAI,wBAAwB,CAqK7D"}

package/lib/typescript/useRouteObserverReactNavigation.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useRouteObserverReactNavigation.d.ts","sourceRoot":"","sources":["../../src/useRouteObserverReactNavigation.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAIH,OAAO,EAAiB,KAAK,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AAwEvE;;;;;GAKG;AACH,wBAAgB,+BAA+B,CAC7C,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,gBAAgB,KAAK,IAAI,QAmC7C"}
+{"version":3,"file":"useRouteObserverReactNavigation.d.ts","sourceRoot":"","sources":["../../src/useRouteObserverReactNavigation.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAIH,OAAO,EAAiB,KAAK,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AA4EvE;;;;;GAKG;AACH,wBAAgB,+BAA+B,CAC7C,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,gBAAgB,KAAK,IAAI,QAmC7C"}

package/lib/typescript/utils/safeReactNavigation.d.ts

@@ -4,7 +4,18 @@
  * Provides optional imports for React Navigation hooks.
  * Falls back to no-op implementations when @react-navigation/native is not installed.
  */
+import { type Context } from "react";
 export declare function useSafeNavigation(): any;
 export declare function useSafeNavigationState(selector: (state: any) => any): any;
+/** CommonActions from @react-navigation/native, or null when absent. */
+export declare function getCommonActions(): any;
+/** StackActions from @react-navigation/native, or null when absent. */
+export declare function getStackActions(): any;
+/**
+ * NavigationContainerRefContext, read via @react-navigation/native's
+ * re-export (never from @react-navigation/core directly — core is not a
+ * declared dependency). Falls back to an always-undefined context.
+ */
+export declare function getNavigationContainerRefContext(): Context<any>;
 export declare function isReactNavigationAvailable(): boolean;
 //# sourceMappingURL=safeReactNavigation.d.ts.map

package/lib/typescript/utils/safeReactNavigation.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"safeReactNavigation.d.ts","sourceRoot":"","sources":["../../../src/utils/safeReactNavigation.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AA2EH,wBAAgB,iBAAiB,QAWhC;AAED,wBAAgB,sBAAsB,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,GAAG,OAWnE;AAMD,wBAAgB,0BAA0B,IAAI,OAAO,CAEpD"}
+{"version":3,"file":"safeReactNavigation.d.ts","sourceRoot":"","sources":["../../../src/utils/safeReactNavigation.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAA0B,KAAK,OAAO,EAAE,MAAM,OAAO,CAAC;AAyE7D,wBAAgB,iBAAiB,QAWhC;AAED,wBAAgB,sBAAsB,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,GAAG,OAWnE;AAcD,wEAAwE;AACxE,wBAAgB,gBAAgB,IAAI,GAAG,CAItC;AAED,uEAAuE;AACvE,wBAAgB,eAAe,IAAI,GAAG,CAIrC;AAED;;;;GAIG;AACH,wBAAgB,gCAAgC,IAAI,OAAO,CAAC,GAAG,CAAC,CAK/D;AAMD,wBAAgB,0BAA0B,IAAI,OAAO,CAEpD"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@buoy-gg/route-events",
-  "version": "6.0.0",
-  "description": "route-events package",
+  "version": "7.0.0",
+  "description": "Navigation devtool for React Native — live stack, full sitemap, jump to any screen. Expo Router & React Navigation. Part of Buoy devtools.",
   "main": "lib/commonjs/index.js",
   "module": "lib/module/index.js",
   "types": "lib/typescript/index.d.ts",
@@ -26,11 +26,11 @@
   ],
   "sideEffects": false,
   "dependencies": {
-    "@buoy-gg/shared-ui": "6.0.0",
-    "@buoy-gg/floating-tools-core": "6.0.0"
+    "@buoy-gg/floating-tools-core": "7.0.0",
+    "@buoy-gg/shared-ui": "7.0.0"
   },
   "peerDependencies": {
-    "@buoy-gg/license": "6.0.0",
+    "@buoy-gg/license": "7.0.0",
     "@react-native-async-storage/async-storage": "^2.0.0 || ^3.1.0",
     "@react-navigation/native": "*",
     "expo-router": "*",
@@ -40,6 +40,9 @@
   "peerDependenciesMeta": {
     "expo-router": {
       "optional": true
+    },
+    "@react-navigation/native": {
+      "optional": true
     }
   },
   "devDependencies": {
@@ -49,7 +52,7 @@
     "@types/react-native": "^0.73.0",
     "expo-router": "~5.0.7",
     "typescript": "~5.8.3",
-    "@buoy-gg/license": "6.0.0"
+    "@buoy-gg/license": "7.0.0"
   },
   "react-native-builder-bob": {
     "source": "src",
@@ -72,17 +75,29 @@
   },
   "repository": {
     "type": "git",
-    "url": "https://github.com/LovesWorking/react-native-buoy.git",
+    "url": "https://github.com/Buoy-gg/buoy.git",
     "directory": "packages/route-events"
   },
   "bugs": {
     "url": "https://github.com/LovesWorking/react-native-buoy/issues"
   },
-  "homepage": "https://github.com/LovesWorking/react-native-buoy/tree/main/packages/route-events#readme",
+  "homepage": "https://buoy.gg/tools/routes",
   "publishConfig": {
     "access": "public",
     "tag": "latest"
   },
+  "keywords": [
+    "react-native",
+    "expo",
+    "devtools",
+    "debugging",
+    "react-native-devtools",
+    "flipper-alternative",
+    "navigation",
+    "expo-router",
+    "react-navigation",
+    "routes"
+  ],
   "scripts": {
     "build": "bob build",
     "typecheck": "tsc --noEmit",