@buoy-gg/route-events 3.0.1 → 4.0.1

package/lib/commonjs/components/RoutesSitemap.js

@@ -25,12 +25,35 @@ var _jsxRuntime = require("react/jsx-runtime");
 // Types
 // ============================================================================
 
+// On desktop (web) the toolbar has far more room, so scale the action buttons
+// up for easier clicking and a less cramped header.
+const IS_DESKTOP = _reactNative.Platform.OS === "web";
+const ACTION_ICON_SIZE = IS_DESKTOP ? 22 : 16;
+
+// Synthetic route representing the app's home/index ("/"). Used by the
+// "Home" toolbar shortcut so navigation works the same as tapping any route.
+const HOME_ROUTE = {
+  path: "/",
+  name: "index",
+  type: "index",
+  params: [],
+  nodeType: "route",
+  contextKey: "/",
+  isInternal: false,
+  children: [],
+  depth: 0
+};
+
 // ============================================================================
 // Main Component
 // ============================================================================
 
 function RoutesSitemap({
-  style
+  style,
+  injectedRoutes,
+  injectedSource,
+  injectedLastUpdatedAt,
+  onNavigateRoute
 }) {
   const [searchQuery, setSearchQuery] = (0, _react.useState)("");
   const [isSearching, setIsSearching] = (0, _react.useState)(false);
@@ -52,6 +75,7 @@ function RoutesSitemap({
     groups,
     stats,
     isLoaded,
+    isSupported,
     filteredRoutes,
     routes,
     refresh,
@@ -59,7 +83,10 @@ function RoutesSitemap({
     source
   } = (0, _useRouteSitemap.useRouteSitemap)({
     searchQuery,
-    sortBy: "path"
+    sortBy: "path",
+    injectedRoutes,
+    injectedSource,
+    injectedLastUpdatedAt
   });
 
   // Prepare copy data - memoized so it only rebuilds when dependencies change
@@ -146,9 +173,16 @@ function RoutesSitemap({
       }
     }], "plain-text");
   }, [router]);
-  const handleNavigate = (0, _react.useCallback)(route => {
-    // Gate behind Pro
-    if (!isPro) {
+  const handleNavigate = (0, _react.useCallback)((route, options) => {
+    // When a navigation delegate is supplied (dashboard → device), hand off
+    // entirely: the delegate owns Pro gating and param resolution.
+    if (onNavigateRoute) {
+      onNavigateRoute(route);
+      return;
+    }
+
+    // Gate behind Pro (the Home shortcut bypasses this — it's always free)
+    if (!isPro && !options?.bypassPro) {
       setShowUpgradeModal(true);
       return;
     }
@@ -182,7 +216,12 @@ function RoutesSitemap({
     } catch (error) {
       _reactNative.Alert.alert("Navigation Error", String(error));
     }
-  }, [router, promptForParams, isPro]);
+  }, [router, promptForParams, isPro, onNavigateRoute]);
+  const handleGoHome = (0, _react.useCallback)(() => {
+    handleNavigate(HOME_ROUTE, {
+      bypassPro: true
+    });
+  }, [handleNavigate]);
   const handleManualRefresh = (0, _react.useCallback)(() => {
     if (isRefreshing) return;
     setIsRefreshing(true);
@@ -217,7 +256,7 @@ function RoutesSitemap({
         style: styles.loadingContainer,
         children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
           style: styles.loadingText,
-          children: "Loading routes..."
+          children: isSupported ? "Loading routes..." : "Route sitemap isn't available on the dashboard — the route tree lives on the device. Use the Events tab to see navigation here."
         })
       })
     });
@@ -229,39 +268,54 @@ function RoutesSitemap({
       children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
         style: styles.actionsRow,
         children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-          style: styles.actionWrapper,
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.ToolbarCopyButton, {
+          style: [styles.actionWrapper, IS_DESKTOP && styles.actionWrapperDesktop],
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TouchableOpacity, {
+            style: [styles.iconButton, IS_DESKTOP && styles.iconButtonDesktop],
+            onPress: handleGoHome,
+            accessibilityLabel: "Go to home route",
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.Home, {
+              size: ACTION_ICON_SIZE,
+              color: _sharedUi.buoyColors.textSecondary
+            })
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+            style: [styles.actionLabel, IS_DESKTOP && styles.actionLabelDesktop],
+            children: "Home"
+          })]
+        }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+          style: [styles.actionWrapper, IS_DESKTOP && styles.actionWrapperDesktop],
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.CopyButton, {
             value: copyAllData,
-            buttonStyle: styles.actionButtonHeader
+            size: IS_DESKTOP ? ACTION_ICON_SIZE : 14,
+            buttonStyle: IS_DESKTOP ? styles.actionButtonHeaderDesktop : styles.actionButtonHeader
           }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-            style: styles.actionLabel,
+            style: [styles.actionLabel, IS_DESKTOP && styles.actionLabelDesktop],
             children: "Copy"
           })]
         }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-          style: styles.actionWrapper,
+          style: [styles.actionWrapper, IS_DESKTOP && styles.actionWrapperDesktop],
           children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TouchableOpacity, {
-            style: [styles.iconButton, isRefreshing && styles.refreshButtonDisabled],
+            style: [styles.iconButton, IS_DESKTOP && styles.iconButtonDesktop, isRefreshing && styles.refreshButtonDisabled],
             onPress: handleManualRefresh,
             disabled: isRefreshing,
             children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.RefreshCw, {
-              size: 16,
+              size: ACTION_ICON_SIZE,
               color: isRefreshing ? _sharedUi.buoyColors.textMuted : _sharedUi.buoyColors.textSecondary
             })
           }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-            style: styles.actionLabel,
+            style: [styles.actionLabel, IS_DESKTOP && styles.actionLabelDesktop],
             children: "Refresh"
           })]
         }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-          style: styles.actionWrapper,
+          style: [styles.actionWrapper, IS_DESKTOP && styles.actionWrapperDesktop],
           children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TouchableOpacity, {
-            style: styles.iconButton,
+            style: [styles.iconButton, IS_DESKTOP && styles.iconButtonDesktop],
             onPress: () => setIsSearching(true),
             children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.Search, {
-              size: 16,
+              size: ACTION_ICON_SIZE,
               color: _sharedUi.buoyColors.textSecondary
             })
           }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-            style: styles.actionLabel,
+            style: [styles.actionLabel, IS_DESKTOP && styles.actionLabelDesktop],
             children: "Search"
           })]
         })]
@@ -407,18 +461,18 @@ function RouteGroupView({
           children: group.routes.length
         })
       })]
-    }), isExpanded && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+    }), group.description && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      style: styles.groupDescription,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+        style: styles.groupDescriptionText,
+        children: group.description
+      })
+    }), isExpanded && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
       style: styles.routesList,
-      children: [group.description && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-        style: styles.groupDescription,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-          style: styles.groupDescriptionText,
-          children: group.description
-        })
-      }), group.routes.map((route, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(RouteItemView, {
+      children: group.routes.map((route, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(RouteItemView, {
         route: route,
         onNavigate: onNavigate
-      }, `${route.path}-${index}`))]
+      }, `${route.path}-${index}`))
     })]
   });
 }
@@ -429,85 +483,85 @@ function RouteItemView({
 }) {
   const [isExpanded, setIsExpanded] = (0, _react.useState)(false);
   const hasChildren = route.children.length > 0;
-  const hasParams = route.params.length > 0;
   const typeColor = getRouteTypeColor(route.type);
   const canNavigate = route.type !== "layout" && route.type !== "group";
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+
+  // Leaf routes (no children) have nothing to drill into — expanding would only
+  // reveal the Copy/Go actions, so show those inline instead of behind a toggle.
+  const isExpandable = hasChildren;
+  const showDetails = isExpandable ? isExpanded : true;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
     style: [styles.routeItem, {
       marginLeft: depth * 12
     }],
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
       style: styles.routeCard,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.TouchableOpacity, {
-        style: styles.routeHeaderLeft,
-        onPress: () => setIsExpanded(!isExpanded),
-        activeOpacity: 0.7,
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-          style: styles.expandIndicator,
-          children: isExpanded ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.ChevronDown, {
-            size: 14,
-            color: _sharedUi.buoyColors.textSecondary
-          }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.ChevronRight, {
-            size: 14,
-            color: _sharedUi.buoyColors.textSecondary
-          })
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-          style: styles.routePath,
-          numberOfLines: 1,
-          children: route.path
-        })]
-      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-        style: styles.routeHeaderActions,
-        children: [hasChildren && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-          style: styles.childCountBadge,
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-            style: styles.childCountText,
-            children: route.children.length
-          })
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-          style: [styles.typeTag, {
-            backgroundColor: `${typeColor}15`,
-            borderColor: `${typeColor}40`
-          }],
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-            style: [styles.typeText, {
-              color: typeColor
-            }],
-            children: route.type.toUpperCase()
-          })
-        })]
-      })]
-    }), isExpanded && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-      style: styles.routeDetails,
       children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-        style: styles.routeButtons,
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.InlineCopyButton, {
-          value: route.path,
-          buttonStyle: styles.actionButton
-        }), canNavigate && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TouchableOpacity, {
-          style: [styles.actionButton, styles.navigateButton],
-          onPress: () => onNavigate(route),
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-            style: styles.navigateButtonText,
-            children: "Go"
-          })
-        })]
-      }), hasParams && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-        style: styles.paramsContainer,
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-          style: styles.paramsLabel,
-          children: "Parameters:"
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-          style: styles.paramsRow,
-          children: route.params.map(param => /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-            style: styles.paramTag,
+        style: styles.routeHeader,
+        children: [isExpandable ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.TouchableOpacity, {
+          style: styles.routeHeaderLeft,
+          onPress: () => setIsExpanded(!isExpanded),
+          activeOpacity: 0.7,
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+            style: styles.expandIndicator,
+            children: isExpanded ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.ChevronDown, {
+              size: 14,
+              color: _sharedUi.buoyColors.textSecondary
+            }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.ChevronRight, {
+              size: 14,
+              color: _sharedUi.buoyColors.textSecondary
+            })
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+            style: styles.routePath,
+            numberOfLines: 3,
+            children: route.path
+          })]
+        }) :
+        /*#__PURE__*/
+        // Non-toggling header for leaf routes (keeps the chevron column as a
+        // spacer so paths stay aligned with expandable siblings).
+        (0, _jsxRuntime.jsxs)(_reactNative.View, {
+          style: styles.routeHeaderLeft,
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+            style: styles.expandIndicator
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+            style: styles.routePath,
+            numberOfLines: 3,
+            children: route.path
+          })]
+        }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+          style: styles.routeHeaderActions,
+          children: [hasChildren && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+            style: styles.childCountBadge,
             children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-              style: styles.paramText,
-              children: param
+              style: styles.childCountText,
+              children: route.children.length
             })
-          }, param))
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+            style: [styles.typeTag, {
+              backgroundColor: `${typeColor}15`,
+              borderColor: `${typeColor}40`
+            }],
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+              style: [styles.typeText, {
+                color: typeColor
+              }],
+              children: route.type.toUpperCase()
+            })
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.InlineCopyButton, {
+            value: route.path,
+            buttonStyle: styles.iconAction
+          }), canNavigate && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TouchableOpacity, {
+            style: styles.goButton,
+            onPress: () => onNavigate(route),
+            activeOpacity: 0.7,
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+              style: styles.goButtonText,
+              children: "Go"
+            })
+          })]
         })]
-      }), hasChildren && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      }), showDetails && hasChildren && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
         style: styles.childrenContainer,
         children: route.children.map((child, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(RouteItemView, {
           route: child,
@@ -515,7 +569,7 @@ function RouteItemView({
           onNavigate: onNavigate
         }, `${child.path}-${index}`))
       })]
-    })]
+    })
   });
 }
 
@@ -569,7 +623,11 @@ const styles = _reactNative.StyleSheet.create({
   loadingText: {
     color: _sharedUi.buoyColors.textSecondary,
     fontSize: 14,
-    fontFamily: "monospace"
+    fontFamily: "monospace",
+    textAlign: "center",
+    lineHeight: 20,
+    paddingHorizontal: 32,
+    maxWidth: 420
   },
   header: {
     flexDirection: "column",
@@ -581,7 +639,7 @@ const styles = _reactNative.StyleSheet.create({
   actionsRow: {
     flexDirection: "row",
     alignItems: "center",
-    justifyContent: "flex-end",
+    justifyContent: "space-between",
     gap: 12,
     paddingBottom: 4
   },
@@ -616,22 +674,37 @@ const styles = _reactNative.StyleSheet.create({
     letterSpacing: 0.5
   },
   actionWrapper: {
+    flex: 1,
     alignItems: "center",
     justifyContent: "center",
     gap: 4,
     minWidth: 48
   },
+  actionWrapperDesktop: {
+    gap: 8,
+    minWidth: 72
+  },
   actionButtonHeader: {
     padding: 6,
     borderRadius: 4,
     backgroundColor: _sharedUi.buoyColors.input
   },
+  actionButtonHeaderDesktop: {
+    padding: 12,
+    borderRadius: 8,
+    backgroundColor: _sharedUi.buoyColors.input
+  },
   iconButton: {
     padding: 6,
     borderRadius: 4,
     alignItems: "center",
     justifyContent: "center"
   },
+  iconButtonDesktop: {
+    padding: 12,
+    borderRadius: 8,
+    backgroundColor: _sharedUi.buoyColors.input
+  },
   actionLabel: {
     fontSize: 8,
     color: _sharedUi.buoyColors.textMuted,
@@ -639,6 +712,9 @@ const styles = _reactNative.StyleSheet.create({
     textTransform: "uppercase",
     letterSpacing: 0.5
   },
+  actionLabelDesktop: {
+    fontSize: 12
+  },
   refreshButtonDisabled: {
     opacity: 0.5
   },
@@ -783,15 +859,11 @@ const styles = _reactNative.StyleSheet.create({
     marginBottom: 6
   },
   routeCard: {
-    flexDirection: "row",
-    alignItems: "center",
-    justifyContent: "space-between",
-    paddingVertical: 10,
-    paddingHorizontal: 12,
     backgroundColor: _sharedUi.buoyColors.card,
     borderRadius: 6,
     borderWidth: 1,
     borderColor: _sharedUi.buoyColors.border,
+    overflow: "hidden",
     shadowColor: "#000",
     shadowOffset: {
       width: 0,
@@ -801,8 +873,16 @@ const styles = _reactNative.StyleSheet.create({
     shadowRadius: 2,
     elevation: 1
   },
+  routeHeader: {
+    flexDirection: "row",
+    alignItems: "center",
+    justifyContent: "space-between",
+    paddingVertical: 7,
+    paddingHorizontal: 10,
+    gap: 8
+  },
   expandIndicator: {
-    width: 20,
+    width: 18,
     alignItems: "center"
   },
   routeHeaderLeft: {
@@ -851,76 +931,29 @@ const styles = _reactNative.StyleSheet.create({
     fontWeight: "600",
     fontFamily: "monospace"
   },
-  routeDetails: {
-    paddingHorizontal: 12,
-    paddingTop: 8,
-    paddingBottom: 12,
-    gap: 12,
-    borderTopWidth: 1,
-    borderTopColor: _sharedUi.buoyColors.border,
-    backgroundColor: _sharedUi.buoyColors.card,
-    borderRadius: 6,
+  // Compact icon-sized Copy button in the header action cluster.
+  iconAction: {
+    width: 28,
+    height: 24,
+    borderRadius: 4,
+    backgroundColor: _sharedUi.buoyColors.input,
     borderWidth: 1,
     borderColor: _sharedUi.buoyColors.border,
-    borderTopLeftRadius: 0,
-    borderTopRightRadius: 0,
-    marginTop: -6
-  },
-  paramsContainer: {
-    gap: 6
-  },
-  paramsLabel: {
-    fontSize: 10,
-    color: _sharedUi.buoyColors.textSecondary,
-    fontFamily: "monospace",
-    marginBottom: 4
-  },
-  paramsRow: {
-    flexDirection: "row",
-    flexWrap: "wrap",
-    gap: 6
+    alignItems: "center",
+    justifyContent: "center"
   },
-  paramTag: {
-    backgroundColor: "#F59E0B15",
-    borderColor: "#F59E0B40",
-    borderWidth: 1,
+  // Small "Go" pill in the header action cluster.
+  goButton: {
+    height: 24,
+    paddingHorizontal: 10,
     borderRadius: 4,
-    paddingHorizontal: 6,
-    paddingVertical: 2
-  },
-  paramText: {
-    fontSize: 10,
-    color: "#F59E0B",
-    fontFamily: "monospace",
-    fontWeight: "600"
-  },
-  routeButtons: {
-    flexDirection: "row",
-    gap: 6,
-    marginBottom: 12
-  },
-  actionButton: {
-    flexDirection: "row",
     alignItems: "center",
-    gap: 4,
-    backgroundColor: _sharedUi.buoyColors.input,
-    borderRadius: 4,
-    paddingHorizontal: 12,
-    paddingVertical: 6,
-    borderWidth: 1,
-    borderColor: _sharedUi.buoyColors.border
-  },
-  actionButtonText: {
-    fontSize: 12,
-    color: _sharedUi.buoyColors.textSecondary,
-    fontFamily: "monospace",
-    fontWeight: "600"
-  },
-  navigateButton: {
+    justifyContent: "center",
     backgroundColor: _sharedUi.buoyColors.primary + "15",
+    borderWidth: 1,
     borderColor: _sharedUi.buoyColors.primary + "40"
   },
-  navigateButtonText: {
+  goButtonText: {
     fontSize: 12,
     color: _sharedUi.buoyColors.primary,
     fontFamily: "monospace",
@@ -929,6 +962,9 @@ const styles = _reactNative.StyleSheet.create({
   childrenContainer: {
     borderLeftWidth: 2,
     borderLeftColor: _sharedUi.buoyColors.border,
-    marginLeft: 16
+    marginLeft: 16,
+    marginRight: 8,
+    marginTop: 2,
+    marginBottom: 8
   }
 });

package/lib/commonjs/expoRouterStore.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.getExpoRouterStore = getExpoRouterStore;
 exports.getRouteNodeMetadata = getRouteNodeMetadata;
+exports.isExpoRouterStoreSupported = isExpoRouterStoreSupported;
 exports.loadRouteNode = loadRouteNode;
 let cachedStore = null;
 let cachedStoreSource = null;
@@ -30,10 +31,26 @@ function logOnce(message, error) {
  * The storeRef gets populated when Expo Router's useStore() hook runs.
  * So we cache the store reference but its property values update over time.
  */
+/**
+ * Whether the expo-router store can be loaded in this runtime. The store is
+ * pulled in via CommonJS `require`, which only exists under Metro/Node. On the
+ * web (e.g. the desktop dashboard rendering these RN tools via react-native-web)
+ * `require` is undefined, the route tree lives on the device — not here — and
+ * there is nothing to load. Callers use this to skip polling/logging.
+ */
+function isExpoRouterStoreSupported() {
+  return typeof require !== "undefined";
+}
 function getExpoRouterStore() {
   if (cachedStore) {
     return cachedStore;
   }
+
+  // No `require` (web): bail quietly rather than throwing ReferenceError and
+  // logging a misleading "install expo-router" message on the dashboard.
+  if (!isExpoRouterStoreSupported()) {
+    return null;
+  }
   const loadFromBuild = () => {
     try {
       const module = require("expo-router/build/global-state/router-store");

package/lib/commonjs/index.js

@@ -63,6 +63,12 @@ Object.defineProperty(exports, "routeEventStore", {
     return _routeEventStore.routeEventStore;
   }
 });
+Object.defineProperty(exports, "routeEventsSyncAdapter", {
+  enumerable: true,
+  get: function () {
+    return _routeEventsSyncAdapter.routeEventsSyncAdapter;
+  }
+});
 Object.defineProperty(exports, "routeEventsToolPreset", {
   enumerable: true,
   get: function () {
@@ -129,6 +135,7 @@ var _useRouteObserverReactNavigation = require("./useRouteObserverReactNavigatio
 var _useRouteEvents = require("./hooks/useRouteEvents");
 var _useRouteSitemap = require("./useRouteSitemap");
 var _useNavigationStack = require("./useNavigationStack");
+var _routeEventsSyncAdapter = require("./sync/routeEventsSyncAdapter");
 var _RouteParser = require("./RouteParser");
 var _RouteObserver = require("./RouteObserver");
 var _routeEventStore = require("./stores/routeEventStore");

package/lib/commonjs/stores/navigationStackStore.js

@@ -0,0 +1,45 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.navigationStackStore = void 0;
+/**
+ * Navigation Stack Store
+ *
+ * Holds the latest serializable navigation stack plus references to the live
+ * navigation action functions. The stack is captured inside the navigation tree
+ * by <RouteTracker /> (which runs useNavigationStack), and read by the
+ * route-events sync adapter so the dashboard can render the Stack tab and drive
+ * navigation on the device remotely.
+ *
+ * The stack itself (StackDisplayItem[]) is JSON-serializable and synced to the
+ * dashboard. The action functions are NOT serialized — they stay on the device
+ * and are invoked when the dashboard sends a remote action.
+ */
+
+class NavigationStackStore {
+  stack = [];
+  actions = null;
+  listeners = new Set();
+  getStack() {
+    return this.stack;
+  }
+  setStack(stack) {
+    this.stack = stack;
+    this.listeners.forEach(listener => listener());
+  }
+  getActions() {
+    return this.actions;
+  }
+  setActions(actions) {
+    this.actions = actions;
+  }
+  subscribe(listener) {
+    this.listeners.add(listener);
+    return () => {
+      this.listeners.delete(listener);
+    };
+  }
+}
+const navigationStackStore = exports.navigationStackStore = new NavigationStackStore();