@buoy-gg/shared-ui 3.0.0 → 3.0.2

package/lib/commonjs/JsModal.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.JsModal = void 0;
 var _react = require("react");
 var _reactNative = require("react-native");
+var _absoluteFill = require("./utils/absoluteFill.js");
 var _useSafeAreaInsets = require("./hooks/useSafeAreaInsets.js");
 var _index = require("./ui/gameUI/index.js");
 var _index2 = require("./ui/components/index.js");
@@ -1241,7 +1242,7 @@ const JsModalComponent = ({
 // ============================================================================
 const styles = _reactNative.StyleSheet.create({
   fullScreenContainer: {
-    ..._reactNative.StyleSheet.absoluteFillObject,
+    ..._absoluteFill.absoluteFill,
     zIndex: 1000
   },
   bottomSheetWrapper: {

package/lib/commonjs/dataViewer/VirtualizedDataExplorer.js

@@ -726,7 +726,6 @@ const useDataFlattening = (data, maxDepth = 10, autoExpandFirstLevel = false) =>
 const VirtualizedItemComponent = ({
   item,
   onToggleExpanded,
-  data,
   index,
   onSelect,
   isSelected
@@ -790,9 +789,9 @@ const VirtualizedItemComponent = ({
           children: formatValue(item.value, item.valueType)
         })]
       })]
-    }), item.id === "root" && data !== undefined && data !== null ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_CopyButton.CopyButton, {
-      value: data,
-      size: 16,
+    }), item.value !== undefined ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_CopyButton.CopyButton, {
+      value: item.value,
+      size: 14,
       buttonStyle: {
         marginLeft: 8,
         marginRight: 8
@@ -877,7 +876,6 @@ const VirtualizedDataExplorer = ({
     item: item,
     index: index,
     onToggleExpanded: toggleExpanded,
-    data: data,
     onSelect: setSelectedIndex,
     isSelected: selectedIndex === index
   });

package/lib/commonjs/hooks/safe-area-impl.js

@@ -7,7 +7,7 @@ exports.useNativeSafeAreaInsets = exports.safeAreaType = exports.hasSafeAreaPack
 /**
  * Auto-generated safe area implementation
  * Detected: none
- * Generated at: 2026-06-12T23:17:33.323Z
+ * Generated at: 2026-06-23T21:16:34.896Z
  *
  * DO NOT EDIT - This file is generated by scripts/detect-safe-area.js
  *

package/lib/commonjs/icons/lucide-icons.js

@@ -3,8 +3,8 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.PlusIcon = exports.Plus = exports.PlayIcon = exports.Play = exports.PhoneIcon = exports.Phone = exports.PauseIcon = exports.Pause = exports.PaletteIcon = exports.Palette = exports.NavigationIcon = exports.Navigation = exports.MusicIcon = exports.Music = exports.MinusIcon = exports.Minus = exports.Maximize2Icon = exports.Maximize2 = exports.LockIcon = exports.Lock = exports.LinkIcon = exports.Link = exports.LayersIcon = exports.Layers = exports.KeyIcon = exports.Key = exports.InfoIcon = exports.Info = exports.ImageIcon = exports.Image = exports.HelpCircle = exports.HashIcon = exports.Hash = exports.HardDriveIcon = exports.HardDrive = exports.HandIcon = exports.Hand = exports.GlobeIcon = exports.Globe = exports.GitBranchIcon = exports.GitBranch = exports.FloatWindow = exports.FlaskConicalIcon = exports.FlaskConical = exports.FilterIcon = exports.Filter = exports.FilmIcon = exports.Film = exports.FileTextIcon = exports.FileText = exports.FileJsonIcon = exports.FileJson = exports.FileCodeIcon = exports.FileCode = exports.EyeOffIcon = exports.EyeOff = exports.EyeIcon = exports.Eye = exports.Edit3Icon = exports.Edit3 = exports.DownloadIcon = exports.Download = exports.DockBottom = exports.DatabaseIcon = exports.Database = exports.CopyIcon = exports.Copy = exports.CloudIcon = exports.Cloud = exports.ClockIcon = exports.Clock = exports.ChevronUpIcon = exports.ChevronUp = exports.ChevronRightIcon = exports.ChevronRight = exports.ChevronLeftIcon = exports.ChevronLeft = exports.ChevronDownIcon = exports.ChevronDown = exports.CheckSquareIcon = exports.CheckSquare = exports.CheckIcon = exports.CheckCircleIcon = exports.CheckCircle2Icon = exports.CheckCircle2 = exports.CheckCircle = exports.Check = exports.BugIcon = exports.Bug = exports.BoxIcon = exports.Box = exports.BarChart3Icon = exports.BarChart3 = exports.AlertTriangleIcon = exports.AlertTriangle = exports.AlertOctagon = exports.AlertCircleIcon = exports.AlertCircle = exports.ActivityIcon = exports.Activity = void 0;
-exports.ZapIcon = exports.Zap = exports.XIcon = exports.XCircleIcon = exports.XCircle = exports.X = exports.WifiIcon = exports.Wifi = exports.VolumeIcon = exports.Volume = exports.UsersIcon = exports.Users = exports.UserIcon = exports.User = exports.UploadIcon = exports.Upload = exports.UnlockIcon = exports.Unlock = exports.TriangleAlertIcon = exports.TriangleAlert = exports.TrashIcon = exports.Trash2Icon = exports.Trash2 = exports.Trash = exports.TouchpadIcon = exports.Touchpad = exports.TimerIcon = exports.Timer = exports.TestTube2Icon = exports.TestTube2 = exports.SquareIcon = exports.SquareDashedIcon = exports.SquareDashed = exports.Square = exports.SmartphoneIcon = exports.Smartphone = exports.ShieldIcon = exports.Shield = exports.SettingsIcon = exports.Settings = exports.ServerIcon = exports.Server = exports.SearchIcon = exports.Search = exports.RouteIcon = exports.Route = exports.RefreshCwIcon = exports.RefreshCw = exports.PowerIcon = exports.Power = void 0;
+exports.PlayIcon = exports.Play = exports.PhoneIcon = exports.Phone = exports.PauseIcon = exports.Pause = exports.PaletteIcon = exports.Palette = exports.NavigationIcon = exports.Navigation = exports.MusicIcon = exports.Music = exports.MinusIcon = exports.Minus = exports.Maximize2Icon = exports.Maximize2 = exports.LockIcon = exports.Lock = exports.LinkIcon = exports.Link = exports.LayersIcon = exports.Layers = exports.KeyIcon = exports.Key = exports.InfoIcon = exports.Info = exports.ImageIcon = exports.Image = exports.HomeIcon = exports.Home = exports.HelpCircle = exports.HashIcon = exports.Hash = exports.HardDriveIcon = exports.HardDrive = exports.HandIcon = exports.Hand = exports.GlobeIcon = exports.Globe = exports.GitBranchIcon = exports.GitBranch = exports.FloatWindow = exports.FlaskConicalIcon = exports.FlaskConical = exports.FilterIcon = exports.Filter = exports.FilmIcon = exports.Film = exports.FileTextIcon = exports.FileText = exports.FileJsonIcon = exports.FileJson = exports.FileCodeIcon = exports.FileCode = exports.EyeOffIcon = exports.EyeOff = exports.EyeIcon = exports.Eye = exports.Edit3Icon = exports.Edit3 = exports.DownloadIcon = exports.Download = exports.DockBottom = exports.DatabaseIcon = exports.Database = exports.CopyIcon = exports.Copy = exports.CloudIcon = exports.Cloud = exports.ClockIcon = exports.Clock = exports.ChevronUpIcon = exports.ChevronUp = exports.ChevronRightIcon = exports.ChevronRight = exports.ChevronLeftIcon = exports.ChevronLeft = exports.ChevronDownIcon = exports.ChevronDown = exports.CheckSquareIcon = exports.CheckSquare = exports.CheckIcon = exports.CheckCircleIcon = exports.CheckCircle2Icon = exports.CheckCircle2 = exports.CheckCircle = exports.Check = exports.BugIcon = exports.Bug = exports.BoxIcon = exports.Box = exports.BarChart3Icon = exports.BarChart3 = exports.AlertTriangleIcon = exports.AlertTriangle = exports.AlertOctagon = exports.AlertCircleIcon = exports.AlertCircle = exports.ActivityIcon = exports.Activity = void 0;
+exports.ZapIcon = exports.Zap = exports.XIcon = exports.XCircleIcon = exports.XCircle = exports.X = exports.WifiIcon = exports.Wifi = exports.VolumeIcon = exports.Volume = exports.UsersIcon = exports.Users = exports.UserIcon = exports.User = exports.UploadIcon = exports.Upload = exports.UnlockIcon = exports.Unlock = exports.TriangleAlertIcon = exports.TriangleAlert = exports.TrashIcon = exports.Trash2Icon = exports.Trash2 = exports.Trash = exports.TouchpadIcon = exports.Touchpad = exports.TimerIcon = exports.Timer = exports.TestTube2Icon = exports.TestTube2 = exports.SquareIcon = exports.SquareDashedIcon = exports.SquareDashed = exports.Square = exports.SmartphoneIcon = exports.Smartphone = exports.ShieldIcon = exports.Shield = exports.SettingsIcon = exports.Settings = exports.ServerIcon = exports.Server = exports.SearchIcon = exports.Search = exports.RouteIcon = exports.Route = exports.RefreshCwIcon = exports.RefreshCw = exports.PowerIcon = exports.Power = exports.PlusIcon = exports.Plus = void 0;
 var _reactNative = require("react-native");
 var OriginalIcons = _interopRequireWildcard(require("./lucide-icons-original-full.js"));
 var _jsxRuntime = require("react/jsx-runtime");
@@ -1398,8 +1398,67 @@ const Plus = ({
     strokeWidth: strokeWidth
   })]
 });
+
+// Refresh / reload icon: a smooth 270° ring (open on the right) with a
+// clockwise triangle arrowhead. Built from the buoy icon-editor design
+// (smootharc ring + triangle) using the View-based border trick so it stays
+// crisp at any size. `strokeWidth` is accepted for API compatibility but the
+// proportions are fixed to keep the perfected look.
 exports.Plus = Plus;
 const RefreshCw = ({
+  size = 24,
+  color = "currentColor",
+  strokeWidth: _strokeWidth = 2,
+  ...props
+}) => {
+  const RING_RADIUS = 7; // outer radius, centered in the 24x24 viewBox
+  const RING_STROKE = 2.4;
+  const ARROW_SIZE = 5.2;
+  const ARROW_HALF = ARROW_SIZE * 0.577; // equilateral-ish half-width
+  // Arrowhead anchor (from the editor design, mapped into the 0..24 viewBox)
+  const arrowLeft = 12 + 3.162277660168379;
+  const arrowTop = 12 - 2.846049894151541 - ARROW_HALF;
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(Svg, {
+    width: size,
+    height: size,
+    viewBox: "0 0 24 24",
+    ...props,
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      style: {
+        position: "absolute",
+        left: 12 - RING_RADIUS,
+        top: 12 - RING_RADIUS,
+        width: RING_RADIUS * 2,
+        height: RING_RADIUS * 2,
+        borderRadius: RING_RADIUS,
+        borderWidth: RING_STROKE,
+        borderTopColor: color,
+        borderLeftColor: color,
+        borderBottomColor: color,
+        borderRightColor: "transparent"
+      }
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      style: {
+        position: "absolute",
+        left: arrowLeft,
+        top: arrowTop,
+        width: 0,
+        height: 0,
+        borderTopWidth: ARROW_HALF,
+        borderBottomWidth: ARROW_HALF,
+        borderLeftWidth: ARROW_SIZE,
+        borderTopColor: "transparent",
+        borderBottomColor: "transparent",
+        borderLeftColor: color,
+        transform: [{
+          rotate: "45deg"
+        }]
+      }
+    })]
+  });
+};
+exports.RefreshCw = RefreshCw;
+const Home = ({
   size = 24,
   color = "currentColor",
   strokeWidth = 2,
@@ -1410,42 +1469,65 @@ const RefreshCw = ({
   viewBox: "0 0 24 24",
   ...props,
   children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(Line, {
-    x1: 23,
-    y1: 4,
-    x2: 23,
-    y2: 10,
+    x1: 3,
+    y1: 10,
+    x2: 12,
+    y2: 3,
     stroke: color,
     strokeWidth: strokeWidth
   }), /*#__PURE__*/(0, _jsxRuntime.jsx)(Line, {
-    x1: 23,
-    y1: 10,
-    x2: 17,
+    x1: 12,
+    y1: 3,
+    x2: 21,
     y2: 10,
     stroke: color,
     strokeWidth: strokeWidth
   }), /*#__PURE__*/(0, _jsxRuntime.jsx)(Line, {
-    x1: 1,
-    y1: 20,
-    x2: 1,
-    y2: 14,
+    x1: 5,
+    y1: 9,
+    x2: 5,
+    y2: 21,
     stroke: color,
     strokeWidth: strokeWidth
   }), /*#__PURE__*/(0, _jsxRuntime.jsx)(Line, {
-    x1: 1,
-    y1: 14,
-    x2: 7,
-    y2: 14,
+    x1: 19,
+    y1: 9,
+    x2: 19,
+    y2: 21,
     stroke: color,
     strokeWidth: strokeWidth
-  }), /*#__PURE__*/(0, _jsxRuntime.jsx)(Circle, {
-    cx: 12,
-    cy: 12,
-    r: 9,
+  }), /*#__PURE__*/(0, _jsxRuntime.jsx)(Line, {
+    x1: 5,
+    y1: 21,
+    x2: 19,
+    y2: 21,
+    stroke: color,
+    strokeWidth: strokeWidth
+  }), /*#__PURE__*/(0, _jsxRuntime.jsx)(Line, {
+    x1: 10,
+    y1: 21,
+    x2: 10,
+    y2: 15,
+    stroke: color,
+    strokeWidth: strokeWidth
+  }), /*#__PURE__*/(0, _jsxRuntime.jsx)(Line, {
+    x1: 10,
+    y1: 15,
+    x2: 14,
+    y2: 15,
+    stroke: color,
+    strokeWidth: strokeWidth
+  }), /*#__PURE__*/(0, _jsxRuntime.jsx)(Line, {
+    x1: 14,
+    y1: 15,
+    x2: 14,
+    y2: 21,
     stroke: color,
     strokeWidth: strokeWidth
   })]
 });
-exports.RefreshCw = RefreshCw;
+exports.Home = Home;
+const HomeIcon = exports.HomeIcon = Home;
 const Search = ({
   size = 24,
   color = "currentColor",

package/lib/commonjs/index.js

@@ -4,6 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 var _exportNames = {
+  absoluteFill: true,
   displayValue: true,
   parseDisplayValue: true,
   getSafeAreaInsets: true,
@@ -143,6 +144,12 @@ Object.defineProperty(exports, "UpgradePrompt", {
     return _index12.UpgradePrompt;
   }
 });
+Object.defineProperty(exports, "absoluteFill", {
+  enumerable: true,
+  get: function () {
+    return _index3.absoluteFill;
+  }
+});
 Object.defineProperty(exports, "buoyColors", {
   enumerable: true,
   get: function () {

package/lib/commonjs/license/DeviceLimitModal.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.DeviceLimitModal = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _reactNative = require("react-native");
+var _absoluteFill = require("../utils/absoluteFill.js");
 var _macOSDesignSystemColors = require("../ui/gameUI/constants/macOSDesignSystemColors.js");
 var _lucideIcons = require("../icons/lucide-icons.js");
 var _jsxRuntime = require("react/jsx-runtime");
@@ -272,7 +273,7 @@ const styles = _reactNative.StyleSheet.create({
     alignItems: "center"
   },
   backdrop: {
-    ..._reactNative.StyleSheet.absoluteFillObject,
+    ..._absoluteFill.absoluteFill,
     backgroundColor: "rgba(0, 0, 0, 0.8)"
   },
   modal: {

package/lib/commonjs/license/LicenseEntryModal.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.LicenseEntryModal = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _reactNative = require("react-native");
+var _absoluteFill = require("../utils/absoluteFill.js");
 var _macOSDesignSystemColors = require("../ui/gameUI/constants/macOSDesignSystemColors.js");
 var _lucideIcons = require("../icons/lucide-icons.js");
 var _jsxRuntime = require("react/jsx-runtime");
@@ -199,7 +200,7 @@ const styles = _reactNative.StyleSheet.create({
     alignItems: "center"
   },
   backdrop: {
-    ..._reactNative.StyleSheet.absoluteFillObject,
+    ..._absoluteFill.absoluteFill,
     backgroundColor: "rgba(0, 0, 0, 0.8)"
   },
   modal: {

package/lib/commonjs/license/ManageDevicesModal.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.ManageDevicesModal = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _reactNative = require("react-native");
+var _absoluteFill = require("../utils/absoluteFill.js");
 var _gameUIColors = require("../ui/gameUI/constants/gameUIColors.js");
 var _lucideIcons = require("../icons/lucide-icons.js");
 var _jsxRuntime = require("react/jsx-runtime");
@@ -343,7 +344,7 @@ const styles = _reactNative.StyleSheet.create({
     alignItems: "center"
   },
   backdrop: {
-    ..._reactNative.StyleSheet.absoluteFillObject,
+    ..._absoluteFill.absoluteFill,
     backgroundColor: "rgba(0, 0, 0, 0.7)"
   },
   modal: {

package/lib/commonjs/stores/BaseEventStore.js

@@ -270,10 +270,34 @@ class BaseEventStore extends _subscribable.Subscribable {
    * mirror mode where full snapshots arrive from a synced device.
    */
   replaceEvents(events) {
-    this.events = events.slice(0, this.maxEvents);
+    this.events = this.dedupeById(events).slice(0, this.maxEvents);
     this.notifyArrayListeners();
   }
 
+  /**
+   * Drop events that share an `id` with an earlier event, keeping the first
+   * (newest, since events are newest-first) occurrence. Remote snapshots can
+   * momentarily carry duplicate ids — e.g. a device's request counter resets
+   * on reload while older events with the same id are still in the buffer —
+   * which makes React list keys (keyed on `id`) collide. Events without an
+   * `id` are passed through untouched.
+   */
+  dedupeById(events) {
+    const seen = new Set();
+    const result = [];
+    for (const event of events) {
+      const id = event?.id;
+      if (id == null) {
+        result.push(event);
+        continue;
+      }
+      if (seen.has(id)) continue;
+      seen.add(id);
+      result.push(event);
+    }
+    return result;
+  }
+
   /**
    * Set maximum number of events to keep
    */

package/lib/commonjs/ui/components/CompactRow.js

@@ -28,77 +28,77 @@ function CompactRow({
 }) {
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
     style: styles.rowWrapper,
-    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.TouchableOpacity, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
       style: [styles.row, isSelected && styles.selectedRow, isExpanded && [styles.expandedRowActive, {
         borderColor: expandedGlowColor || _gameUIColors.buoyColors.primary,
         shadowColor: expandedGlowColor || _gameUIColors.buoyColors.primary
       }]],
-      onPress: onPress,
-      activeOpacity: 0.8,
-      disabled: disabled || !onPress,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-        style: styles.rowContent,
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-          style: styles.statusSection,
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-            style: [styles.statusDot, {
-              backgroundColor: statusDotColor
-            }]
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TouchableOpacity, {
+        onPress: onPress,
+        activeOpacity: 0.8,
+        disabled: disabled || !onPress,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+          style: styles.rowContent,
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+            style: styles.statusSection,
+            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+              style: [styles.statusDot, {
+                backgroundColor: statusDotColor
+              }]
+            }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+              style: styles.statusInfo,
+              children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+                style: [styles.statusLabel, {
+                  color: statusDotColor
+                }],
+                numberOfLines: 1,
+                children: statusLabel
+              }), statusSublabel ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+                style: styles.observerText,
+                numberOfLines: 1,
+                children: statusSublabel
+              }) : null]
+            })]
           }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-            style: styles.statusInfo,
+            style: styles.querySection,
             children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-              style: [styles.statusLabel, {
-                color: statusDotColor
-              }],
-              numberOfLines: 1,
-              children: statusLabel
-            }), statusSublabel && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-              style: styles.observerText,
+              style: styles.queryHash,
+              numberOfLines: isExpanded ? undefined : 2,
+              children: primaryText
+            }), !isExpanded && secondaryText ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+              style: styles.secondaryText,
               numberOfLines: 1,
-              children: statusSublabel
+              children: secondaryText
+            }) : null]
+          }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+            style: styles.rightSection,
+            children: [(customBadge || badgeText !== undefined || !isExpanded && bottomRightText) && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+              style: styles.badgeContainer,
+              children: [customBadge ? customBadge : badgeText !== undefined ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+                style: [styles.statusBadge, {
+                  color: badgeColor || statusDotColor
+                }],
+                children: badgeText
+              }) : null, !isExpanded && bottomRightText ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+                style: styles.bottomRightText,
+                numberOfLines: 1,
+                children: bottomRightText
+              }) : null]
+            }), showChevron && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+              style: styles.chevronContainer,
+              children: isExpanded ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.ChevronDown, {
+                size: 14,
+                color: _gameUIColors.buoyColors.textMuted
+              }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.ChevronRight, {
+                size: 14,
+                color: _gameUIColors.buoyColors.textMuted
+              })
             })]
           })]
-        }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-          style: styles.querySection,
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-            style: styles.queryHash,
-            numberOfLines: isExpanded ? undefined : 2,
-            children: primaryText
-          }), !isExpanded && secondaryText && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-            style: styles.secondaryText,
-            numberOfLines: 1,
-            children: secondaryText
-          })]
-        }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-          style: styles.rightSection,
-          children: [(customBadge || badgeText !== undefined) && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-            style: styles.badgeContainer,
-            children: customBadge ? customBadge : /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-              style: [styles.statusBadge, {
-                color: badgeColor || statusDotColor
-              }],
-              children: badgeText
-            })
-          }), showChevron && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-            style: styles.chevronContainer,
-            children: isExpanded ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.ChevronDown, {
-              size: 14,
-              color: _gameUIColors.buoyColors.textMuted
-            }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.ChevronRight, {
-              size: 14,
-              color: _gameUIColors.buoyColors.textMuted
-            })
-          })]
-        })]
+        })
       }), isExpanded && expandedContent && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
         style: styles.expandedContent,
         children: expandedContent
-      }), !isExpanded && bottomRightText && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-        style: styles.bottomRightContainer,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-          style: styles.bottomRightText,
-          children: bottomRightText
-        })
       })]
     })
   });
@@ -200,7 +200,9 @@ const styles = _reactNative.StyleSheet.create({
     gap: 8
   },
   badgeContainer: {
-    alignItems: "flex-end"
+    flexDirection: "column",
+    alignItems: "flex-end",
+    gap: 2
   },
   statusBadge: {
     fontSize: 12,
@@ -217,11 +219,6 @@ const styles = _reactNative.StyleSheet.create({
     borderTopColor: _gameUIColors.buoyColors.border + "20",
     marginLeft: 24 // Align with content after status dot
   },
-  bottomRightContainer: {
-    position: "absolute",
-    bottom: 4,
-    right: 8
-  },
   bottomRightText: {
     fontSize: 9,
     color: _gameUIColors.buoyColors.textMuted,

package/lib/commonjs/ui/components/EventHistoryViewer/EventPickerModal.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.EventPickerModal = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _reactNative = require("react-native");
+var _absoluteFill = require("../../../utils/absoluteFill.js");
 var _macOSDesignSystemColors = require("../../gameUI/constants/macOSDesignSystemColors.js");
 var _lucideIcons = require("../../../icons/lucide-icons.js");
 var _jsxRuntime = require("react/jsx-runtime");
@@ -82,13 +83,13 @@ const EventPickerModal = exports.EventPickerModal = /*#__PURE__*/(0, _react.memo
 });
 const styles = _reactNative.StyleSheet.create({
   overlay: {
-    ..._reactNative.StyleSheet.absoluteFillObject,
+    ..._absoluteFill.absoluteFill,
     zIndex: 20,
     justifyContent: "center",
     alignItems: "center"
   },
   backdrop: {
-    ..._reactNative.StyleSheet.absoluteFillObject,
+    ..._absoluteFill.absoluteFill,
     backgroundColor: "rgba(0,0,0,0.65)"
   },
   card: {

package/lib/commonjs/ui/components/ExpandableSectionWithModal.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.ExpandableSectionWithModal = ExpandableSectionWithModal;
 var _react = require("react");
 var _reactNative = require("react-native");
+var _absoluteFill = require("../../utils/absoluteFill.js");
 var _useSafeAreaInsets = require("../../hooks/useSafeAreaInsets.js");
 var _index = require("../../icons/index.js");
 var _ExpandableSection = require("./ExpandableSection.js");
@@ -125,7 +126,7 @@ const styles = _reactNative.StyleSheet.create({
     flex: 1
   },
   backdrop: {
-    ..._reactNative.StyleSheet.absoluteFillObject,
+    ..._absoluteFill.absoluteFill,
     backgroundColor: "rgba(0, 0, 0, 0.8)"
   },
   backdropTouchable: {

package/lib/commonjs/ui/console/CyberpunkConsoleSection.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.CyberpunkConsoleSection = CyberpunkConsoleSection;
 var _react = require("react");
 var _reactNative = require("react-native");
+var _absoluteFill = require("../../utils/absoluteFill.js");
 var _index = require("../../icons/index.js");
 var _index2 = require("../gameUI/index.js");
 var _jsxRuntime = require("react/jsx-runtime");
@@ -484,31 +485,31 @@ const styles = _reactNative.StyleSheet.create({
     backgroundColor: "rgba(5, 5, 10, 0.6)" // Darker glass background
   },
   glassLayer1: {
-    ..._reactNative.StyleSheet.absoluteFillObject,
+    ..._absoluteFill.absoluteFill,
     backgroundColor: "rgba(10, 10, 15, 0.7)",
     opacity: 0.8
   },
   glassLayer2: {
-    ..._reactNative.StyleSheet.absoluteFillObject,
+    ..._absoluteFill.absoluteFill,
     backgroundColor: "rgba(15, 15, 25, 0.5)",
     opacity: 0.6,
     top: "20%",
     left: "20%"
   },
   glassLayer3: {
-    ..._reactNative.StyleSheet.absoluteFillObject,
+    ..._absoluteFill.absoluteFill,
     backgroundColor: "rgba(20, 20, 35, 0.3)",
     opacity: 0.4,
     top: "40%",
     left: "40%"
   },
   glassShimmer: {
-    ..._reactNative.StyleSheet.absoluteFillObject,
+    ..._absoluteFill.absoluteFill,
     backgroundColor: "rgba(255, 255, 255, 0.03)",
     opacity: 0.6
   },
   glitchOverlayLayer: {
-    ..._reactNative.StyleSheet.absoluteFillObject,
+    ..._absoluteFill.absoluteFill,
     borderRadius: 12,
     borderWidth: 1,
     justifyContent: "center",

package/lib/commonjs/ui/console/GalaxyButton.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.GalaxyButton = GalaxyButton;
 var _react = require("react");
 var _reactNative = require("react-native");
+var _absoluteFill = require("../../utils/absoluteFill.js");
 var _jsxRuntime = require("react/jsx-runtime");
 const {
   width: screenWidth
@@ -76,7 +77,7 @@ const styles = _reactNative.StyleSheet.create({
     overflow: "hidden"
   },
   starsContainer: {
-    ..._reactNative.StyleSheet.absoluteFillObject,
+    ..._absoluteFill.absoluteFill,
     overflow: "hidden"
   },
   starsLayer: {

package/lib/commonjs/ui/gameUI/components/GameUIStatusHeader.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.GameUIStatusHeader = GameUIStatusHeader;
 var _reactNative = require("react-native");
+var _absoluteFill = require("../../../utils/absoluteFill.js");
 var _gameUIColors = require("../constants/gameUIColors.js");
 var _jsxRuntime = require("react/jsx-runtime");
 /**
@@ -82,7 +83,7 @@ const styles = _reactNative.StyleSheet.create({
     overflow: "hidden"
   },
   glow: {
-    ..._reactNative.StyleSheet.absoluteFillObject,
+    ..._absoluteFill.absoluteFill,
     opacity: 0.5
   },
   content: {

package/lib/commonjs/utils/absoluteFill.js

@@ -0,0 +1,28 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.absoluteFill = void 0;
+/**
+ * Spreadable absolute-fill style.
+ *
+ * Replaces `StyleSheet.absoluteFillObject`, which was REMOVED in React Native
+ * 0.85 (returns `undefined` there). Spreading `undefined` is a silent no-op, so
+ * any overlay/backdrop/full-screen Pressable that relied on it collapses to zero
+ * size on RN 0.85+ — invisible and untappable.
+ *
+ * `StyleSheet.absoluteFill` is not a safe replacement for the spread pattern
+ * because its type changed across versions: it's a registered style *number* on
+ * RN <= 0.84 (spreading a number yields `{}`) and a frozen object only on 0.85+.
+ *
+ * This plain object works identically on every RN version, whether spread
+ * (`{ ...absoluteFill }`) or passed directly (`style={absoluteFill}`).
+ */
+const absoluteFill = exports.absoluteFill = {
+  position: "absolute",
+  top: 0,
+  left: 0,
+  right: 0,
+  bottom: 0
+};