@buoy-gg/route-events 7.0.33 → 7.0.35

package/lib/commonjs/components/NavigationStack.js

@@ -416,7 +416,7 @@ const styles = _reactNative.StyleSheet.create({
   loadingText: {
     color: _sharedUi.night.color.textSecondary,
     fontSize: 14,
-    fontFamily: "monospace"
+    fontFamily: _sharedUi.monoFont
   },
   errorContainer: {
     flex: 1,
@@ -428,13 +428,13 @@ const styles = _reactNative.StyleSheet.create({
     color: _sharedUi.buoyColors.error,
     fontSize: 16,
     fontWeight: "600",
-    fontFamily: "monospace",
+    fontFamily: _sharedUi.monoFont,
     marginBottom: 8
   },
   errorDetail: {
     color: _sharedUi.night.color.textSecondary,
     fontSize: 12,
-    fontFamily: "monospace",
+    fontFamily: _sharedUi.monoFont,
     textAlign: "center"
   },
   emptyContainer: {
@@ -447,13 +447,13 @@ const styles = _reactNative.StyleSheet.create({
     color: _sharedUi.night.color.text,
     fontSize: 16,
     fontWeight: "600",
-    fontFamily: "monospace",
+    fontFamily: _sharedUi.monoFont,
     marginBottom: 8
   },
   emptySubtext: {
     color: _sharedUi.night.color.textSecondary,
     fontSize: 14,
-    fontFamily: "monospace",
+    fontFamily: _sharedUi.monoFont,
     textAlign: "center"
   },
   stackScroll: {
@@ -491,7 +491,7 @@ const styles = _reactNative.StyleSheet.create({
     fontSize: 13,
     fontWeight: "600",
     color: _sharedUi.night.color.text,
-    fontFamily: "monospace",
+    fontFamily: _sharedUi.monoFont,
     flex: 1
   },
   copyRouteButton: {
@@ -507,7 +507,7 @@ const styles = _reactNative.StyleSheet.create({
   statusBadgeText: {
     fontSize: 10,
     fontWeight: "600",
-    fontFamily: "monospace"
+    fontFamily: _sharedUi.monoFont
   },
   expandedContent: {
     paddingHorizontal: 12,
@@ -522,13 +522,13 @@ const styles = _reactNative.StyleSheet.create({
   detailLabel: {
     fontSize: 10,
     color: _sharedUi.night.color.textSecondary,
-    fontFamily: "monospace",
+    fontFamily: _sharedUi.monoFont,
     marginBottom: 2
   },
   detailValue: {
     fontSize: 12,
     color: _sharedUi.night.color.text,
-    fontFamily: "monospace"
+    fontFamily: _sharedUi.monoFont
   },
   dataViewerContainer: {
     marginTop: 4,
@@ -557,7 +557,7 @@ const styles = _reactNative.StyleSheet.create({
     fontSize: 12,
     fontWeight: "600",
     color: _sharedUi.night.color.text,
-    fontFamily: "monospace"
+    fontFamily: _sharedUi.monoFont
   },
   actionButtonTextDisabled: {
     color: _sharedUi.night.color.textTertiary
@@ -565,7 +565,7 @@ const styles = _reactNative.StyleSheet.create({
   helpText: {
     fontSize: 9,
     color: _sharedUi.night.color.textSecondary,
-    fontFamily: "monospace",
+    fontFamily: _sharedUi.monoFont,
     textAlign: "center",
     marginTop: 4,
     lineHeight: 12

package/lib/commonjs/components/ReactNavigationRoutes.js

@@ -550,12 +550,12 @@ const styles = _reactNative.StyleSheet.create({
   emptyText: {
     color: _sharedUi.night.color.textSecondary,
     fontSize: 14,
-    fontFamily: "monospace"
+    fontFamily: _sharedUi.monoFont
   },
   emptySubtext: {
     color: _sharedUi.night.color.textTertiary,
     fontSize: 12,
-    fontFamily: "monospace",
+    fontFamily: _sharedUi.monoFont,
     marginTop: 8
   },
   header: {
@@ -593,7 +593,7 @@ const styles = _reactNative.StyleSheet.create({
   actionLabel: {
     fontSize: 8,
     color: _sharedUi.night.color.textTertiary,
-    fontFamily: "monospace",
+    fontFamily: _sharedUi.monoFont,
     textTransform: "uppercase",
     letterSpacing: 0.5
   },
@@ -620,13 +620,13 @@ const styles = _reactNative.StyleSheet.create({
     fontSize: 18,
     fontWeight: "800",
     color: _sharedUi.night.color.text,
-    fontFamily: "monospace"
+    fontFamily: _sharedUi.monoFont
   },
   statLabel: {
     fontSize: 10,
     color: _sharedUi.night.color.textTertiary,
     marginTop: 4,
-    fontFamily: "monospace",
+    fontFamily: _sharedUi.monoFont,
     textTransform: "uppercase",
     letterSpacing: 0.5
   },
@@ -642,7 +642,7 @@ const styles = _reactNative.StyleSheet.create({
     flex: 1,
     color: _sharedUi.night.color.text,
     fontSize: 14,
-    fontFamily: "monospace"
+    fontFamily: _sharedUi.monoFont
   },
   clearButton: {
     padding: 4
@@ -659,7 +659,7 @@ const styles = _reactNative.StyleSheet.create({
     color: _sharedUi.night.color.accent,
     fontSize: 14,
     fontWeight: "600",
-    fontFamily: "monospace"
+    fontFamily: _sharedUi.monoFont
   },
   scrollView: {
     flex: 1
@@ -681,7 +681,7 @@ const styles = _reactNative.StyleSheet.create({
   metaText: {
     fontSize: 12,
     color: _sharedUi.night.color.textSecondary,
-    fontFamily: "monospace"
+    fontFamily: _sharedUi.monoFont
   },
   sourceBadge: {
     paddingHorizontal: 8,
@@ -695,7 +695,7 @@ const styles = _reactNative.StyleSheet.create({
     fontSize: 11,
     color: _sharedUi.night.color.textSecondary,
     textTransform: "capitalize",
-    fontFamily: "monospace"
+    fontFamily: _sharedUi.monoFont
   },
   groupContainer: {
     marginVertical: 4
@@ -720,7 +720,7 @@ const styles = _reactNative.StyleSheet.create({
     fontSize: 12,
     fontWeight: "700",
     color: _sharedUi.night.color.text,
-    fontFamily: "monospace",
+    fontFamily: _sharedUi.monoFont,
     textTransform: "uppercase",
     letterSpacing: 0.8
   },
@@ -739,7 +739,7 @@ const styles = _reactNative.StyleSheet.create({
     fontSize: 11,
     fontWeight: "600",
     color: "#3B82F6",
-    fontFamily: "monospace"
+    fontFamily: _sharedUi.monoFont
   },
   screensList: {
     // Transparent so the night sheet's star field shows through.
@@ -756,7 +756,7 @@ const styles = _reactNative.StyleSheet.create({
   groupDescriptionText: {
     fontSize: 11,
     color: _sharedUi.night.color.textSecondary,
-    fontFamily: "monospace",
+    fontFamily: _sharedUi.monoFont,
     lineHeight: 16
   },
   screenItem: {
@@ -795,7 +795,7 @@ const styles = _reactNative.StyleSheet.create({
     fontSize: 13,
     fontWeight: "600",
     color: _sharedUi.night.color.text,
-    fontFamily: "monospace",
+    fontFamily: _sharedUi.monoFont,
     flex: 1
   },
   screenHeaderActions: {
@@ -812,7 +812,7 @@ const styles = _reactNative.StyleSheet.create({
   statusText: {
     fontSize: 10,
     fontWeight: "600",
-    fontFamily: "monospace"
+    fontFamily: _sharedUi.monoFont
   },
   headerActionButton: {
     padding: 6,
@@ -830,7 +830,7 @@ const styles = _reactNative.StyleSheet.create({
   navigateButtonText: {
     fontSize: 12,
     color: _sharedUi.night.color.accent,
-    fontFamily: "monospace",
+    fontFamily: _sharedUi.monoFont,
     fontWeight: "600"
   }
 });

package/lib/commonjs/components/RouteEventDetail.js

@@ -90,7 +90,7 @@ const styles = _reactNative.StyleSheet.create({
     fontWeight: "600",
     // Ink on a filled accent surface — the night accent takes dark ink.
     color: _sharedUi.night.color.onAccent,
-    fontFamily: "monospace",
+    fontFamily: _sharedUi.monoFont,
     textTransform: "uppercase",
     letterSpacing: 0.5
   }

package/lib/commonjs/components/RouteEventExpandedContent.js

@@ -172,14 +172,14 @@ const styles = _reactNative.StyleSheet.create({
   detailLabel: {
     fontSize: 10,
     color: _sharedUi.night.color.textSecondary,
-    fontFamily: "monospace",
+    fontFamily: _sharedUi.monoFont,
     fontWeight: "600",
     minWidth: 70
   },
   detailValue: {
     fontSize: 11,
     color: _sharedUi.night.color.text,
-    fontFamily: "monospace",
+    fontFamily: _sharedUi.monoFont,
     flex: 1
   },
   copyButton: {
@@ -198,7 +198,7 @@ const styles = _reactNative.StyleSheet.create({
   dataViewerTitle: {
     fontSize: 11,
     color: _sharedUi.night.color.textSecondary,
-    fontFamily: "monospace",
+    fontFamily: _sharedUi.monoFont,
     fontWeight: "600"
   }
 });

package/lib/commonjs/components/RouteEventItemCompact.js

@@ -191,7 +191,7 @@ const styles = _reactNative.StyleSheet.create({
   badgeText: {
     fontSize: 11,
     fontWeight: "600",
-    fontFamily: "monospace"
+    fontFamily: _sharedUi.monoFont
   },
   goButton: {
     backgroundColor: _sharedUi.night.color.accent,
@@ -204,6 +204,6 @@ const styles = _reactNative.StyleSheet.create({
     fontWeight: "600",
     // Ink on a filled accent surface — the night accent takes dark ink.
     color: _sharedUi.night.color.onAccent,
-    fontFamily: "monospace"
+    fontFamily: _sharedUi.monoFont
   }
 });

package/lib/commonjs/components/RouteEventsModalWithTabs.js

@@ -25,6 +25,23 @@ const CommonActions = (0, _safeReactNavigation.getCommonActions)();
 
 // Free tier limit for route events
 
+/** Persistence recipes: the tab is stored as its bare name, the flag as "true"/"false". */
+const TAB_PERSISTENCE = {
+  // Every tab the selector offers, including "stack": the save side has
+  // always written it, so leaving it off this list meant the Stack tab
+  // was persisted and then silently discarded on the next launch.
+  parse: raw => raw === "routes" || raw === "events" || raw === "stack" ? raw : undefined,
+  serialize: tab => tab
+};
+const BOOLEAN_PERSISTENCE = {
+  parse: raw => raw === "true",
+  serialize: value => value.toString()
+};
+const STRING_SET_PERSISTENCE = {
+  parse: raw => new Set(JSON.parse(raw)),
+  serialize: set => JSON.stringify(Array.from(set))
+};
+
 /**
  * Find the path from root navigation state to a screen by name.
  * Returns array of route names from root to the target, or null if not found.
@@ -85,7 +102,7 @@ function RouteEventsModalWithTabs({
   const router = (0, _sharedUi.useSafeRouter)();
   const containerRef = (0, _safeReactNavigation.useSafeNavigationContainerRef)();
   const hasExpoRouter = (0, _sharedUi.isExpoRouterAvailable)();
-  const [activeTab, setActiveTab] = (0, _react.useState)("events");
+  const [activeTab, setActiveTab] = (0, _sharedUi.usePersistedState)(_sharedUi.devToolsStorageKeys.routeEvents.activeTab(), "events", TAB_PERSISTENCE);
   const [showUpgradeModal, setShowUpgradeModal] = (0, _react.useState)(false);
   // Serialized stack reported up by NavigationStack so the copy button can live
   // in the shared navbar.
@@ -107,7 +124,7 @@ function RouteEventsModalWithTabs({
   // See the RouteTracker component export for easy setup.
 
   // Local state to control subscription (true = subscribed, false = unsubscribed)
-  const [isListeningEnabled, setIsListeningEnabled] = (0, _react.useState)(true);
+  const [isListeningEnabled, setIsListeningEnabled] = (0, _sharedUi.usePersistedState)(_sharedUi.devToolsStorageKeys.routeEvents.isMonitoring(), true, BOOLEAN_PERSISTENCE);
 
   // Event Listener state - using centralized store via hook
   // Pass enabled option to control subscription
@@ -127,11 +144,8 @@ function RouteEventsModalWithTabs({
   const [selectedEvent, setSelectedEvent] = (0, _react.useState)(null);
   const [selectedVisitNumber, setSelectedVisitNumber] = (0, _react.useState)(1);
   const [searchQuery, setSearchQuery] = (0, _react.useState)("");
-  const [ignoredPatterns, setIgnoredPatterns] = (0, _react.useState)(new Set(["/_sitemap", "/api", "/__dev"]));
+  const [ignoredPatterns, setIgnoredPatterns] = (0, _sharedUi.usePersistedState)(_sharedUi.devToolsStorageKeys.routeEvents.eventFilters(), new Set(["/_sitemap", "/api", "/__dev"]), STRING_SET_PERSISTENCE);
   const lastEventRef = (0, _react.useRef)(null);
-  const hasLoadedFilters = (0, _react.useRef)(false);
-  const hasLoadedTabState = (0, _react.useRef)(false);
-  const hasLoadedMonitoringState = (0, _react.useRef)(false);
   const handleModeChange = (0, _react.useCallback)(_mode => {
     // Mode changes handled by JsModal
   }, []);
@@ -183,103 +197,6 @@ function RouteEventsModalWithTabs({
     }
   }, [router, containerRef, hasExpoRouter, remote, isPro]);
 
-  // Load persisted tab state on mount
-  (0, _react.useEffect)(() => {
-    if (!visible || hasLoadedTabState.current) return;
-    const loadTabState = async () => {
-      try {
-        const storedTab = await _sharedUi.persistentStorage.getItem(_sharedUi.devToolsStorageKeys.routeEvents.activeTab());
-        // Every tab the selector offers, including "stack": the save side has
-        // always written it, so leaving it off this list meant the Stack tab
-        // was persisted and then silently discarded on the next launch —
-        // you came back to Events having chosen otherwise.
-        if (storedTab === "routes" || storedTab === "events" || storedTab === "stack") {
-          setActiveTab(storedTab);
-        }
-        hasLoadedTabState.current = true;
-      } catch (error) {
-        // Failed to load tab state
-      }
-    };
-    loadTabState();
-  }, [visible]);
-
-  // Load persisted monitoring state on mount
-  (0, _react.useEffect)(() => {
-    if (!visible || hasLoadedMonitoringState.current) return;
-    const loadMonitoringState = async () => {
-      try {
-        const storedMonitoring = await _sharedUi.persistentStorage.getItem(_sharedUi.devToolsStorageKeys.routeEvents.isMonitoring());
-        if (storedMonitoring !== null) {
-          const shouldMonitor = storedMonitoring === "true";
-          setIsListeningEnabled(shouldMonitor);
-        }
-        hasLoadedMonitoringState.current = true;
-      } catch (error) {
-        // Failed to load monitoring state
-      }
-    };
-    loadMonitoringState();
-  }, [visible]);
-
-  // Save tab state when it changes
-  (0, _react.useEffect)(() => {
-    if (!hasLoadedTabState.current) return;
-    const saveTabState = async () => {
-      try {
-        await _sharedUi.persistentStorage.setItem(_sharedUi.devToolsStorageKeys.routeEvents.activeTab(), activeTab);
-      } catch (error) {
-        // Failed to save tab state
-      }
-    };
-    saveTabState();
-  }, [activeTab]);
-
-  // Save monitoring state when it changes
-  (0, _react.useEffect)(() => {
-    if (!hasLoadedMonitoringState.current) return;
-    const saveMonitoringState = async () => {
-      try {
-        await _sharedUi.persistentStorage.setItem(_sharedUi.devToolsStorageKeys.routeEvents.isMonitoring(), isListening.toString());
-      } catch (error) {
-        // Failed to save monitoring state
-      }
-    };
-    saveMonitoringState();
-  }, [isListening]);
-
-  // Load persisted filters on mount
-  (0, _react.useEffect)(() => {
-    if (!visible || hasLoadedFilters.current) return;
-    const loadFilters = async () => {
-      try {
-        const storedFilters = await _sharedUi.persistentStorage.getItem(_sharedUi.devToolsStorageKeys.routeEvents.eventFilters());
-        if (storedFilters) {
-          const filters = JSON.parse(storedFilters);
-          setIgnoredPatterns(new Set(filters));
-        }
-        hasLoadedFilters.current = true;
-      } catch (error) {
-        // Failed to load filters
-      }
-    };
-    loadFilters();
-  }, [visible]);
-
-  // Save filters when they change
-  (0, _react.useEffect)(() => {
-    if (!hasLoadedFilters.current) return;
-    const saveFilters = async () => {
-      try {
-        const filters = Array.from(ignoredPatterns);
-        await _sharedUi.persistentStorage.setItem(_sharedUi.devToolsStorageKeys.routeEvents.eventFilters(), JSON.stringify(filters));
-      } catch (error) {
-        // Failed to save filters
-      }
-    };
-    saveFilters();
-  }, [ignoredPatterns]);
-
   // Event listener is now managed by useRouteEvents hook
 
   const handleToggleListening = (0, _react.useCallback)(() => {
@@ -729,7 +646,7 @@ const styles = _reactNative.StyleSheet.create({
     fontWeight: "600",
     marginTop: 16,
     marginBottom: 8,
-    fontFamily: "monospace",
+    fontFamily: _sharedUi.monoFont,
     letterSpacing: 0.5,
     textTransform: "uppercase"
   },
@@ -737,7 +654,7 @@ const styles = _reactNative.StyleSheet.create({
     color: _sharedUi.night.color.textSecondary,
     fontSize: 14,
     textAlign: "center",
-    fontFamily: "monospace"
+    fontFamily: _sharedUi.monoFont
   },
   contentWrapper: {
     flex: 1
@@ -752,7 +669,7 @@ const styles = _reactNative.StyleSheet.create({
   statsText: {
     fontSize: 11,
     color: _sharedUi.night.color.textSecondary,
-    fontFamily: "monospace",
+    fontFamily: _sharedUi.monoFont,
     textAlign: "center"
   },
   statsWarning: {
@@ -782,7 +699,7 @@ const styles = _reactNative.StyleSheet.create({
     fontSize: 12,
     fontWeight: "600",
     color: _sharedUi.night.color.warning,
-    fontFamily: "monospace"
+    fontFamily: _sharedUi.monoFont
   },
   lockedEventsBannerSubtext: {
     fontSize: 11,

package/lib/commonjs/components/RouteEventsTimeline.js

@@ -73,17 +73,8 @@ function RouteEventsTimeline({
         onPress: handleItemPress,
         onNavigate: onNavigate
       }),
-      showsVerticalScrollIndicator: true
-      // Clipped cells fail Detox's hittability check even when they are on
-      // screen, so the e2e bundle keeps every mounted row targetable. The
-      // env var is inlined at bundle time; guarded so a non-inlining bundler
-      // keeps production behaviour.
-      ,
-      removeClippedSubviews: !(typeof process !== "undefined" && process.env?.EXPO_PUBLIC_E2E),
-      initialNumToRender: 12,
-      maxToRenderPerBatch: 8,
-      windowSize: 5,
-      updateCellsBatchingPeriod: 50
+      showsVerticalScrollIndicator: true,
+      ..._sharedUi.EVENT_LIST_PRESET
     })
   );
 }
@@ -103,7 +94,7 @@ const styles = _reactNative.StyleSheet.create({
     fontWeight: "600",
     marginTop: 16,
     marginBottom: 8,
-    fontFamily: "monospace",
+    fontFamily: _sharedUi.monoFont,
     letterSpacing: 0.5,
     textTransform: "uppercase"
   },
@@ -111,6 +102,6 @@ const styles = _reactNative.StyleSheet.create({
     color: _sharedUi.night.color.textSecondary,
     fontSize: 14,
     textAlign: "center",
-    fontFamily: "monospace"
+    fontFamily: _sharedUi.monoFont
   }
 });

package/lib/commonjs/components/RoutesSitemap.js

@@ -687,7 +687,7 @@ const styles = _reactNative.StyleSheet.create({
   loadingText: {
     color: _sharedUi.night.color.textSecondary,
     fontSize: 14,
-    fontFamily: "monospace",
+    fontFamily: _sharedUi.monoFont,
     textAlign: "center",
     lineHeight: 20,
     paddingHorizontal: 32,
@@ -728,13 +728,13 @@ const styles = _reactNative.StyleSheet.create({
     fontSize: 18,
     fontWeight: "800",
     color: _sharedUi.night.color.text,
-    fontFamily: "monospace"
+    fontFamily: _sharedUi.monoFont
   },
   statLabel: {
     fontSize: 10,
     color: _sharedUi.night.color.textTertiary,
     marginTop: 4,
-    fontFamily: "monospace",
+    fontFamily: _sharedUi.monoFont,
     textTransform: "uppercase",
     letterSpacing: 0.5
   },
@@ -773,7 +773,7 @@ const styles = _reactNative.StyleSheet.create({
   actionLabel: {
     fontSize: 8,
     color: _sharedUi.night.color.textTertiary,
-    fontFamily: "monospace",
+    fontFamily: _sharedUi.monoFont,
     textTransform: "uppercase",
     letterSpacing: 0.5
   },
@@ -797,7 +797,7 @@ const styles = _reactNative.StyleSheet.create({
   metaText: {
     fontSize: 12,
     color: _sharedUi.night.color.textSecondary,
-    fontFamily: "monospace"
+    fontFamily: _sharedUi.monoFont
   },
   sourceBadge: {
     paddingHorizontal: 8,
@@ -811,7 +811,7 @@ const styles = _reactNative.StyleSheet.create({
     fontSize: 11,
     color: _sharedUi.night.color.textSecondary,
     textTransform: "capitalize",
-    fontFamily: "monospace"
+    fontFamily: _sharedUi.monoFont
   },
   searchContainer: {
     flexDirection: "row",
@@ -825,7 +825,7 @@ const styles = _reactNative.StyleSheet.create({
     flex: 1,
     color: _sharedUi.night.color.text,
     fontSize: 14,
-    fontFamily: "monospace"
+    fontFamily: _sharedUi.monoFont
   },
   clearButton: {
     padding: 4
@@ -842,7 +842,7 @@ const styles = _reactNative.StyleSheet.create({
     color: _sharedUi.night.color.accent,
     fontSize: 14,
     fontWeight: "600",
-    fontFamily: "monospace"
+    fontFamily: _sharedUi.monoFont
   },
   scrollView: {
     flex: 1
@@ -857,7 +857,7 @@ const styles = _reactNative.StyleSheet.create({
   emptyText: {
     color: _sharedUi.night.color.textSecondary,
     fontSize: 14,
-    fontFamily: "monospace"
+    fontFamily: _sharedUi.monoFont
   },
   groupContainer: {
     marginVertical: 4
@@ -882,7 +882,7 @@ const styles = _reactNative.StyleSheet.create({
     fontSize: 12,
     fontWeight: "700",
     color: _sharedUi.night.color.text,
-    fontFamily: "monospace",
+    fontFamily: _sharedUi.monoFont,
     textTransform: "uppercase",
     letterSpacing: 0.8
   },
@@ -901,7 +901,7 @@ const styles = _reactNative.StyleSheet.create({
     fontSize: 11,
     fontWeight: "600",
     color: "#3B82F6",
-    fontFamily: "monospace"
+    fontFamily: _sharedUi.monoFont
   },
   routesList: {
     // Transparent so the night sheet's star field shows through.
@@ -918,7 +918,7 @@ const styles = _reactNative.StyleSheet.create({
   groupDescriptionText: {
     fontSize: 11,
     color: _sharedUi.night.color.textSecondary,
-    fontFamily: "monospace",
+    fontFamily: _sharedUi.monoFont,
     lineHeight: 16
   },
   routeItem: {
@@ -961,7 +961,7 @@ const styles = _reactNative.StyleSheet.create({
     fontSize: 13,
     fontWeight: "600",
     color: _sharedUi.night.color.text,
-    fontFamily: "monospace",
+    fontFamily: _sharedUi.monoFont,
     flex: 1
   },
   routeHeaderActions: {
@@ -984,7 +984,7 @@ const styles = _reactNative.StyleSheet.create({
     fontSize: 11,
     fontWeight: "600",
     color: _sharedUi.night.color.textSecondary,
-    fontFamily: "monospace"
+    fontFamily: _sharedUi.monoFont
   },
   typeTag: {
     borderRadius: 4,
@@ -995,7 +995,7 @@ const styles = _reactNative.StyleSheet.create({
   typeText: {
     fontSize: 10,
     fontWeight: "600",
-    fontFamily: "monospace"
+    fontFamily: _sharedUi.monoFont
   },
   // Compact icon-sized Copy button in the header action cluster.
   iconAction: {
@@ -1022,7 +1022,7 @@ const styles = _reactNative.StyleSheet.create({
   goButtonText: {
     fontSize: 12,
     color: _sharedUi.night.color.accent,
-    fontFamily: "monospace",
+    fontFamily: _sharedUi.monoFont,
     fontWeight: "600"
   },
   childrenContainer: {