@buoy-gg/route-events 7.0.26 → 7.0.28

package/lib/commonjs/components/RouteEventItemCompact.js

@@ -38,11 +38,11 @@ function getRouteTypeColor(routeType) {
     case "home":
       return _sharedUi.buoyColors.success;
     case "dynamic":
-      return _sharedUi.buoyColors.primary;
+      return _sharedUi.night.color.accent;
     case "with-params":
       return _sharedUi.buoyColors.warning;
     default:
-      return _sharedUi.buoyColors.textSecondary;
+      return _sharedUi.night.color.textSecondary;
     // More visible than border color
   }
 }
@@ -180,7 +180,7 @@ const styles = _reactNative.StyleSheet.create({
     fontFamily: "monospace"
   },
   goButton: {
-    backgroundColor: _sharedUi.buoyColors.primary,
+    backgroundColor: _sharedUi.night.color.accent,
     paddingHorizontal: 8,
     paddingVertical: 4,
     borderRadius: 4
@@ -188,7 +188,8 @@ const styles = _reactNative.StyleSheet.create({
   goButtonText: {
     fontSize: 10,
     fontWeight: "600",
-    color: "#FFFFFF",
+    // Ink on a filled accent surface — the night accent takes dark ink.
+    color: _sharedUi.night.color.onAccent,
     fontFamily: "monospace"
   }
 });

package/lib/commonjs/components/RouteEventsModalWithTabs.js

@@ -18,11 +18,10 @@ 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).
+// Resolved once at module load; null when React Navigation is absent
+// (useSafeNavigationContainerRef then yields undefined, so the dispatch
+// paths below never execute).
 const CommonActions = (0, _safeReactNavigation.getCommonActions)();
-const NavigationContainerRefContext = (0, _safeReactNavigation.getNavigationContainerRefContext)();
 
 // Free tier limit for route events
 
@@ -84,7 +83,7 @@ function RouteEventsModalWithTabs({
   remote
 }) {
   const router = (0, _sharedUi.useSafeRouter)();
-  const containerRef = (0, _react.useContext)(NavigationContainerRefContext);
+  const containerRef = (0, _safeReactNavigation.useSafeNavigationContainerRef)();
   const hasExpoRouter = (0, _sharedUi.isExpoRouterAvailable)();
   const [activeTab, setActiveTab] = (0, _react.useState)("events");
   const [showUpgradeModal, setShowUpgradeModal] = (0, _react.useState)(false);
@@ -138,6 +137,19 @@ function RouteEventsModalWithTabs({
   }, []);
   const handleNavigate = (0, _react.useCallback)(pathname => {
     try {
+      // A remote host (Buoy Desktop) means the events belong to a synced
+      // device — this process has no router, so delegate over the socket.
+      // Same Pro gate as remote sitemap navigation: Home stays free so a
+      // free user can always get the device back to a known screen.
+      if (remote) {
+        if (!remote.onNavigatePath) return;
+        if (!isPro && pathname !== "/") {
+          setShowUpgradeModal(true);
+          return;
+        }
+        remote.onNavigatePath(pathname);
+        return;
+      }
       if (hasExpoRouter) {
         router.push(pathname);
       } else if (containerRef) {
@@ -161,11 +173,15 @@ function RouteEventsModalWithTabs({
         containerRef.dispatch(CommonActions.navigate({
           name: screenName
         }));
+      } else {
+        // Neither Expo Router nor a navigation container — say so instead
+        // of swallowing the tap.
+        _reactNative.Alert.alert("Navigation Unavailable", "No Expo Router or React Navigation container was found in this app.");
       }
     } catch (error) {
       _reactNative.Alert.alert("Navigation Error", String(error));
     }
-  }, [router, containerRef, hasExpoRouter]);
+  }, [router, containerRef, hasExpoRouter, remote, isPro]);
 
   // Load persisted tab state on mount
   (0, _react.useEffect)(() => {
@@ -446,7 +462,7 @@ function RouteEventsModalWithTabs({
           style: styles.emptyState,
           children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.Navigation, {
             size: 48,
-            color: _sharedUi.buoyColors.textMuted
+            color: _sharedUi.night.color.textTertiary
           }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
             style: styles.emptyTitle,
             children: searchQuery.trim() ? "No matching events" : isListening ? "No route events yet" : "Event listener is paused"
@@ -472,7 +488,7 @@ function RouteEventsModalWithTabs({
         style: styles.lockedEventsBanner,
         children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.Lock, {
           size: 14,
-          color: _sharedUi.buoyColors.warning
+          color: _sharedUi.night.color.warning
         }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.Text, {
           style: styles.lockedEventsBannerText,
           children: [lockedEventCount, " older ", lockedEventCount === 1 ? 'event' : 'events', " locked"]
@@ -547,7 +563,7 @@ function RouteEventsModalWithTabs({
           style: [styles.iconButton, ignoredPatterns.size > 0 && styles.activeFilterButton],
           children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.Filter, {
             size: 14,
-            color: ignoredPatterns.size > 0 ? _sharedUi.buoyColors.primary : _sharedUi.buoyColors.textSecondary
+            color: ignoredPatterns.size > 0 ? _sharedUi.night.color.accent : _sharedUi.night.color.textSecondary
           })
         }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.PowerToggleButton, {
           isEnabled: isListening,
@@ -558,7 +574,7 @@ function RouteEventsModalWithTabs({
           style: styles.iconButton,
           children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.Trash2, {
             size: 14,
-            color: _sharedUi.buoyColors.error
+            color: _sharedUi.night.color.danger
           })
         })]
       })]
@@ -611,7 +627,11 @@ function RouteEventsModalWithTabs({
       onModeChange: handleModeChange,
       enablePersistence: true,
       initialMode: "bottomSheet",
-      enableGlitchEffects: true,
+      enableGlitchEffects: true
+      // Every screen owns its scrolling (timeline FlatList, sitemap/stack/
+      // detail/filter ScrollViews) — the default wrapper would nest them.
+      ,
+      disableScrollWrapper: true,
       styles: {},
       footer: footerNode,
       footerHeight: footerNode ? 68 : 0,
@@ -638,7 +658,9 @@ const styles = _reactNative.StyleSheet.create({
   inlineRoot: {
     flex: 1,
     minHeight: 0,
-    backgroundColor: _sharedUi.buoyColors.base
+    // Transparent so the desktop workbench's hoisted sky (one field spanning
+    // sidebar + panel) shows through — the shell paints its base beneath it.
+    backgroundColor: "transparent"
   },
   inlineHeader: {
     paddingHorizontal: 12,
@@ -650,10 +672,10 @@ const styles = _reactNative.StyleSheet.create({
   iconButton: {
     padding: 6,
     borderRadius: 6,
-    backgroundColor: _sharedUi.buoyColors.input
+    backgroundColor: _sharedUi.night.color.buttonSurface
   },
   activeFilterButton: {
-    backgroundColor: _sharedUi.buoyColors.primary + "1A"
+    backgroundColor: _sharedUi.night.color.accentSoft
   },
   emptyState: {
     flex: 1,
@@ -662,7 +684,7 @@ const styles = _reactNative.StyleSheet.create({
     padding: 32
   },
   emptyTitle: {
-    color: _sharedUi.buoyColors.text,
+    color: _sharedUi.night.color.text,
     fontSize: 16,
     fontWeight: "600",
     marginTop: 16,
@@ -672,7 +694,7 @@ const styles = _reactNative.StyleSheet.create({
     textTransform: "uppercase"
   },
   emptySubtitle: {
-    color: _sharedUi.buoyColors.textSecondary,
+    color: _sharedUi.night.color.textSecondary,
     fontSize: 14,
     textAlign: "center",
     fontFamily: "monospace"
@@ -683,32 +705,33 @@ const styles = _reactNative.StyleSheet.create({
   statsContainer: {
     paddingHorizontal: 16,
     paddingVertical: 8,
-    backgroundColor: _sharedUi.buoyColors.card,
+    backgroundColor: _sharedUi.night.color.surface,
     borderBottomWidth: 1,
-    borderBottomColor: _sharedUi.buoyColors.border
+    borderBottomColor: _sharedUi.night.color.border
   },
   statsText: {
     fontSize: 11,
-    color: _sharedUi.buoyColors.textSecondary,
+    color: _sharedUi.night.color.textSecondary,
     fontFamily: "monospace",
     textAlign: "center"
   },
   statsWarning: {
-    color: _sharedUi.buoyColors.warning,
+    color: _sharedUi.night.color.warning,
     fontWeight: "600"
   },
   searchContainer: {
     paddingHorizontal: 16,
     paddingVertical: 8,
-    backgroundColor: _sharedUi.buoyColors.base
+    // Transparent so the night sheet's star field shows through.
+    backgroundColor: "transparent"
   },
   lockedEventsBanner: {
     flexDirection: "row",
     alignItems: "center",
     gap: 8,
-    backgroundColor: _sharedUi.buoyColors.warning + "15",
+    backgroundColor: _sharedUi.night.color.warningSoft,
     borderWidth: 1,
-    borderColor: _sharedUi.buoyColors.warning + "30",
+    borderColor: _sharedUi.night.color.warning + "30",
     borderRadius: 8,
     paddingVertical: 10,
     paddingHorizontal: 14,
@@ -718,12 +741,12 @@ const styles = _reactNative.StyleSheet.create({
   lockedEventsBannerText: {
     fontSize: 12,
     fontWeight: "600",
-    color: _sharedUi.buoyColors.warning,
+    color: _sharedUi.night.color.warning,
     fontFamily: "monospace"
   },
   lockedEventsBannerSubtext: {
     fontSize: 11,
-    color: _sharedUi.buoyColors.textSecondary,
+    color: _sharedUi.night.color.textSecondary,
     marginLeft: "auto"
   }
 });

package/lib/commonjs/components/RouteEventsTimeline.js

@@ -35,7 +35,7 @@ function RouteEventsTimeline({
       style: styles.emptyState,
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.Navigation, {
         size: 48,
-        color: _sharedUi.buoyColors.textMuted
+        color: _sharedUi.night.color.textTertiary
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
         style: styles.emptyTitle,
         children: "No events yet"
@@ -89,7 +89,7 @@ const styles = _reactNative.StyleSheet.create({
     padding: 32
   },
   emptyTitle: {
-    color: _sharedUi.buoyColors.text,
+    color: _sharedUi.night.color.text,
     fontSize: 16,
     fontWeight: "600",
     marginTop: 16,
@@ -99,7 +99,7 @@ const styles = _reactNative.StyleSheet.create({
     textTransform: "uppercase"
   },
   emptySubtitle: {
-    color: _sharedUi.buoyColors.textSecondary,
+    color: _sharedUi.night.color.textSecondary,
     fontSize: 14,
     textAlign: "center",
     fontFamily: "monospace"