@buoy-gg/shared-ui 7.0.33 → 7.0.35

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

@@ -0,0 +1,205 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.FooterButton = FooterButton;
+exports.FooterCaption = FooterCaption;
+exports.FooterMessage = FooterMessage;
+exports.FooterRow = FooterRow;
+exports.ToolFooter = ToolFooter;
+var _reactNative = require("react-native");
+var _nightTheme = require("../night/nightTheme.js");
+var _useSafeAreaInsets = require("../../hooks/useSafeAreaInsets.js");
+var _fonts = require("../fonts.js");
+var _jsxRuntime = require("react/jsx-runtime");
+/**
+ * ToolFooter — the night glass bar pinned to the bottom of a tool: dark
+ * backing over the star field, a hairline on top, safe-area padding when
+ * docked as a sheet, rounded corners when floating.
+ *
+ * `EventStepperFooter` draws this bar for the Previous/Next case; the
+ * images and react-query tools each re-drew it for their action bars with
+ * a comment saying "matches EventStepperFooter". This is that bar as a
+ * container, plus `FooterButton` — the mono uppercase plate button those
+ * action bars are made of — and the caption/message lines above the row.
+ */
+
+function ToolFooter({
+  children,
+  safeArea = true,
+  paddingBottom = 12,
+  floating = false,
+  absolute = false,
+  gap = 8,
+  style,
+  testID
+}) {
+  const insets = (0, _useSafeAreaInsets.useSafeAreaInsets)();
+  const bottom = typeof safeArea === "number" ? safeArea + insets.bottom : safeArea ? paddingBottom + insets.bottom : paddingBottom;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+    style: [styles.footer, floating && styles.footerFloating, absolute && styles.footerAbsolute, {
+      paddingBottom: bottom,
+      gap
+    }, style],
+    testID: testID,
+    children: children
+  });
+}
+
+/** A row of footer buttons. */
+function FooterRow({
+  children,
+  style
+}) {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+    style: [styles.row, style],
+    children: children
+  });
+}
+
+/** Tracking caption above a row ("MASS ACTIONS — every image on screen"). */
+function FooterCaption({
+  children,
+  style
+}) {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+    style: [styles.caption, style],
+    numberOfLines: 1,
+    children: children
+  });
+}
+
+/** Mono feedback line ("Restored 3 images"). */
+function FooterMessage({
+  children,
+  tone = "info",
+  style
+}) {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+    style: [styles.message, tone === "muted" && styles.messageMuted, style],
+    numberOfLines: 1,
+    children: children
+  });
+}
+function FooterButton({
+  label,
+  onPress,
+  accent = false,
+  active = false,
+  disabled = false,
+  icon,
+  flex = true,
+  size = "sm",
+  testID,
+  accessibilityLabel,
+  style
+}) {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.TouchableOpacity, {
+    onPress: onPress,
+    disabled: disabled,
+    activeOpacity: 0.7,
+    accessibilityRole: "button",
+    accessibilityLabel: accessibilityLabel ?? label,
+    accessibilityState: {
+      disabled,
+      selected: active
+    },
+    testID: testID,
+    style: [styles.button, flex ? styles.buttonFlex : styles.buttonFixed, size === "md" && styles.buttonMd, active && styles.buttonActive, disabled && styles.disabled, style],
+    children: [icon, /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+      style: [styles.buttonText, size === "md" && styles.buttonTextMd, accent && !disabled && styles.buttonTextAccent, active && styles.buttonTextActive, disabled && styles.buttonTextDisabled],
+      children: label
+    })]
+  });
+}
+const styles = _reactNative.StyleSheet.create({
+  footer: {
+    paddingHorizontal: 12,
+    paddingTop: 10,
+    // Dark glass over the star field — the same bar EventStepperFooter draws.
+    backgroundColor: "rgba(5, 5, 5, 0.92)",
+    borderTopWidth: 1,
+    borderTopColor: _nightTheme.night.color.border
+  },
+  footerFloating: {
+    borderBottomLeftRadius: 14,
+    borderBottomRightRadius: 14
+  },
+  footerAbsolute: {
+    position: "absolute",
+    left: 0,
+    right: 0,
+    bottom: 0
+  },
+  row: {
+    flexDirection: "row",
+    alignItems: "center",
+    gap: 6
+  },
+  caption: {
+    color: _nightTheme.night.color.textTertiary,
+    fontSize: 9,
+    fontWeight: "700",
+    letterSpacing: 0.8
+  },
+  message: {
+    color: _nightTheme.night.color.info,
+    fontSize: 10,
+    fontFamily: _fonts.monoFont
+  },
+  messageMuted: {
+    color: _nightTheme.night.color.textTertiary,
+    fontFamily: undefined
+  },
+  button: {
+    flexDirection: "row",
+    alignItems: "center",
+    justifyContent: "center",
+    gap: 6,
+    paddingVertical: 8,
+    // No horizontal padding: six of these share one row on a phone, and the
+    // mono uppercase label needs every point it can get before it wraps.
+    paddingHorizontal: 0,
+    borderRadius: 6,
+    backgroundColor: _nightTheme.night.color.button,
+    borderWidth: _reactNative.StyleSheet.hairlineWidth,
+    borderColor: _nightTheme.night.color.border
+  },
+  buttonFlex: {
+    flex: 1
+  },
+  buttonFixed: {
+    paddingHorizontal: 10
+  },
+  buttonMd: {
+    paddingVertical: 8
+  },
+  buttonActive: {
+    backgroundColor: _nightTheme.night.color.accentSoft,
+    borderColor: _nightTheme.night.color.accentBorderStrong
+  },
+  buttonText: {
+    fontSize: 10,
+    fontWeight: "600",
+    color: _nightTheme.night.color.textSecondary,
+    fontFamily: _fonts.monoFont,
+    textTransform: "uppercase"
+  },
+  buttonTextMd: {
+    fontSize: 11,
+    color: _nightTheme.night.color.text
+  },
+  buttonTextAccent: {
+    color: _nightTheme.night.color.warning
+  },
+  buttonTextActive: {
+    color: _nightTheme.night.color.accent
+  },
+  buttonTextDisabled: {
+    color: _nightTheme.night.color.textTertiary
+  },
+  disabled: {
+    opacity: 0.4
+  }
+});

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

@@ -33,6 +33,18 @@ Object.defineProperty(exports, "Badge", {
     return _Badge.Badge;
   }
 });
+Object.defineProperty(exports, "ChangeRow", {
+  enumerable: true,
+  get: function () {
+    return _ChangeRow.ChangeRow;
+  }
+});
+Object.defineProperty(exports, "ChipStrip", {
+  enumerable: true,
+  get: function () {
+    return _ChipStrip.ChipStrip;
+  }
+});
 Object.defineProperty(exports, "ClipboardHintBanner", {
   enumerable: true,
   get: function () {
@@ -93,6 +105,12 @@ Object.defineProperty(exports, "DetailView", {
     return _DetailView.DetailView;
   }
 });
+Object.defineProperty(exports, "DetailViewToggle", {
+  enumerable: true,
+  get: function () {
+    return _DetailViewToggle.DetailViewToggle;
+  }
+});
 Object.defineProperty(exports, "DevToolsCard", {
   enumerable: true,
   get: function () {
@@ -123,6 +141,12 @@ Object.defineProperty(exports, "EmptyState", {
     return _EmptyState.EmptyState;
   }
 });
+Object.defineProperty(exports, "EntityFilterView", {
+  enumerable: true,
+  get: function () {
+    return _EntityFilterView.EntityFilterView;
+  }
+});
 Object.defineProperty(exports, "EventHistoryViewer", {
   enumerable: true,
   get: function () {
@@ -159,6 +183,12 @@ Object.defineProperty(exports, "ExpandedInfoRow", {
     return _ExpandedInfoRow.ExpandedInfoRow;
   }
 });
+Object.defineProperty(exports, "ExportPreview", {
+  enumerable: true,
+  get: function () {
+    return _ExportPreview.ExportPreview;
+  }
+});
 Object.defineProperty(exports, "FilterBadge", {
   enumerable: true,
   get: function () {
@@ -177,6 +207,30 @@ Object.defineProperty(exports, "FilterSection", {
     return _FilterComponents.FilterSection;
   }
 });
+Object.defineProperty(exports, "FooterButton", {
+  enumerable: true,
+  get: function () {
+    return _ToolFooter.FooterButton;
+  }
+});
+Object.defineProperty(exports, "FooterCaption", {
+  enumerable: true,
+  get: function () {
+    return _ToolFooter.FooterCaption;
+  }
+});
+Object.defineProperty(exports, "FooterMessage", {
+  enumerable: true,
+  get: function () {
+    return _ToolFooter.FooterMessage;
+  }
+});
+Object.defineProperty(exports, "FooterRow", {
+  enumerable: true,
+  get: function () {
+    return _ToolFooter.FooterRow;
+  }
+});
 Object.defineProperty(exports, "GripVerticalIcon", {
   enumerable: true,
   get: function () {
@@ -189,6 +243,12 @@ Object.defineProperty(exports, "HeaderSearchButton", {
     return _HeaderSearchButton.HeaderSearchButton;
   }
 });
+Object.defineProperty(exports, "InfoRow", {
+  enumerable: true,
+  get: function () {
+    return _InfoRow.InfoRow;
+  }
+});
 Object.defineProperty(exports, "InlineCopyButton", {
   enumerable: true,
   get: function () {
@@ -237,6 +297,12 @@ Object.defineProperty(exports, "NoSearchResultsEmptyState", {
     return _EmptyState.NoSearchResultsEmptyState;
   }
 });
+Object.defineProperty(exports, "Pill", {
+  enumerable: true,
+  get: function () {
+    return _Pill.Pill;
+  }
+});
 Object.defineProperty(exports, "PillBadge", {
   enumerable: true,
   get: function () {
@@ -297,6 +363,12 @@ Object.defineProperty(exports, "TimeDisplay", {
     return _TimeDisplay.TimeDisplay;
   }
 });
+Object.defineProperty(exports, "ToggleRow", {
+  enumerable: true,
+  get: function () {
+    return _ToggleRow.ToggleRow;
+  }
+});
 Object.defineProperty(exports, "ToolButton", {
   enumerable: true,
   get: function () {
@@ -309,6 +381,12 @@ Object.defineProperty(exports, "ToolEmptyState", {
     return _ToolEmptyState.ToolEmptyState;
   }
 });
+Object.defineProperty(exports, "ToolFooter", {
+  enumerable: true,
+  get: function () {
+    return _ToolFooter.ToolFooter;
+  }
+});
 Object.defineProperty(exports, "ToolbarClearButton", {
   enumerable: true,
   get: function () {
@@ -363,6 +441,18 @@ Object.defineProperty(exports, "setExpandableWindowControls", {
     return _WindowControls.setExpandableWindowControls;
   }
 });
+Object.defineProperty(exports, "sizeWarningLevel", {
+  enumerable: true,
+  get: function () {
+    return _ExportPreview.sizeWarningLevel;
+  }
+});
+Object.defineProperty(exports, "useChipTap", {
+  enumerable: true,
+  get: function () {
+    return _ChipStrip.useChipTap;
+  }
+});
 Object.defineProperty(exports, "windowDragProps", {
   enumerable: true,
   get: function () {
@@ -405,4 +495,13 @@ var _EventStepperFooter = require("./EventStepperFooter.js");
 var _ExpandablePopover = require("./ExpandablePopover.js");
 var _PowerToggleButton = require("./PowerToggleButton.js");
 var _ExpandedInfoRow = require("./ExpandedInfoRow.js");
-var _index = require("./EventHistoryViewer/index.js");
+var _index = require("./EventHistoryViewer/index.js");
+var _InfoRow = require("./InfoRow.js");
+var _DetailViewToggle = require("./DetailViewToggle.js");
+var _ChangeRow = require("./ChangeRow.js");
+var _Pill = require("./Pill.js");
+var _ToolFooter = require("./ToolFooter.js");
+var _EntityFilterView = require("./EntityFilterView.js");
+var _ToggleRow = require("./ToggleRow.js");
+var _ChipStrip = require("./ChipStrip.js");
+var _ExportPreview = require("./ExportPreview.js");

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

@@ -9,6 +9,7 @@ var _index = require("../../icons/index.js");
 var _CyberpunkButtonOutline = require("./CyberpunkButtonOutline.js");
 var _CyberpunkIconContainer = require("./CyberpunkIconContainer.js");
 var _index2 = require("../gameUI/index.js");
+var _fonts = require("../fonts.js");
 var _jsxRuntime = require("react/jsx-runtime");
 function CyberpunkSectionButton({
   id: _id,
@@ -95,14 +96,14 @@ const styles = _reactNative.StyleSheet.create({
     fontSize: 14,
     fontWeight: "700",
     letterSpacing: 0.5,
-    fontFamily: "monospace"
+    fontFamily: _fonts.monoFont
   },
   subtitle: {
     fontSize: 12,
     fontWeight: "600",
     marginTop: 1,
     letterSpacing: 0.5,
-    fontFamily: "monospace",
+    fontFamily: _fonts.monoFont,
     opacity: 0.85
   },
   arrowContainer: {

package/lib/commonjs/ui/fonts.js

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "monoFont", {
+  enumerable: true,
+  get: function () {
+    return _floatingToolsCore.monoFont;
+  }
+});
+var _floatingToolsCore = require("@buoy-gg/floating-tools-core");

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

@@ -7,6 +7,7 @@ exports.GameUICollapsibleSection = GameUICollapsibleSection;
 var _reactNative = require("react-native");
 var _index = require("../../../icons/index.js");
 var _gameUIColors = require("../constants/gameUIColors.js");
+var _fonts = require("../../fonts.js");
 var _jsxRuntime = require("react/jsx-runtime");
 /**
  * Reusable collapsible section component for Game UI
@@ -94,7 +95,7 @@ const styles = _reactNative.StyleSheet.create({
   title: {
     fontSize: 11,
     color: _gameUIColors.gameUIColors.primary,
-    fontFamily: "monospace",
+    fontFamily: _fonts.monoFont,
     fontWeight: "700",
     letterSpacing: 2,
     opacity: 0.9
@@ -102,7 +103,7 @@ const styles = _reactNative.StyleSheet.create({
   subtitle: {
     fontSize: 9,
     color: _gameUIColors.gameUIColors.secondary,
-    fontFamily: "monospace",
+    fontFamily: _fonts.monoFont,
     paddingHorizontal: 4,
     marginTop: 2,
     opacity: 0.7
@@ -114,7 +115,7 @@ const styles = _reactNative.StyleSheet.create({
   },
   badgeText: {
     fontSize: 10,
-    fontFamily: "monospace",
+    fontFamily: _fonts.monoFont,
     fontWeight: "700"
   }
 });

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

@@ -7,6 +7,7 @@ exports.GameUICompactStats = GameUICompactStats;
 var _react = require("react");
 var _reactNative = require("react-native");
 var _gameUIColors = require("../constants/gameUIColors.js");
+var _fonts = require("../../fonts.js");
 var _jsxRuntime = require("react/jsx-runtime");
 /**
  * Reusable compact stats display component
@@ -180,13 +181,13 @@ const styles = _reactNative.StyleSheet.create({
     fontSize: 11,
     fontWeight: "700",
     color: _gameUIColors.gameUIColors.primary,
-    fontFamily: "monospace",
+    fontFamily: _fonts.monoFont,
     letterSpacing: 1.5
   },
   headerSubtitle: {
     fontSize: 8,
     color: _gameUIColors.gameUIColors.secondary,
-    fontFamily: "monospace",
+    fontFamily: _fonts.monoFont,
     opacity: 0.7
   },
   statusIndicator: {
@@ -202,7 +203,7 @@ const styles = _reactNative.StyleSheet.create({
   statusText: {
     fontSize: 9,
     fontWeight: "600",
-    fontFamily: "monospace",
+    fontFamily: _fonts.monoFont,
     letterSpacing: 0.5
   },
   // Health section
@@ -215,7 +216,7 @@ const styles = _reactNative.StyleSheet.create({
   healthLabel: {
     fontSize: 8,
     color: _gameUIColors.gameUIColors.secondary,
-    fontFamily: "monospace",
+    fontFamily: _fonts.monoFont,
     letterSpacing: 0.5
   },
   healthBarWrapper: {
@@ -234,7 +235,7 @@ const styles = _reactNative.StyleSheet.create({
   healthPercentage: {
     fontSize: 11,
     fontWeight: "700",
-    fontFamily: "monospace"
+    fontFamily: _fonts.monoFont
   },
   // Stats grid
   statsGrid: {
@@ -261,20 +262,20 @@ const styles = _reactNative.StyleSheet.create({
   cardLabel: {
     fontSize: 11,
     fontWeight: "700",
-    fontFamily: "monospace",
+    fontFamily: _fonts.monoFont,
     letterSpacing: 0.5,
     color: _gameUIColors.gameUIColors.primary
   },
   cardSubtitle: {
     fontSize: 8,
     color: _gameUIColors.gameUIColors.secondary,
-    fontFamily: "monospace",
+    fontFamily: _fonts.monoFont,
     opacity: 0.7
   },
   statNumber: {
     fontSize: 16,
     fontWeight: "700",
-    fontFamily: "monospace",
+    fontFamily: _fonts.monoFont,
     minWidth: 28
   },
   valueBlock: {
@@ -283,7 +284,7 @@ const styles = _reactNative.StyleSheet.create({
   percentText: {
     fontSize: 9,
     color: _gameUIColors.gameUIColors.secondary,
-    fontFamily: "monospace"
+    fontFamily: _fonts.monoFont
   },
   statBar: {
     height: 3,
@@ -309,7 +310,7 @@ const styles = _reactNative.StyleSheet.create({
   bottomStatLabel: {
     fontSize: 7,
     color: _gameUIColors.gameUIColors.muted,
-    fontFamily: "monospace",
+    fontFamily: _fonts.monoFont,
     letterSpacing: 0.5,
     marginBottom: 1
   },
@@ -317,7 +318,7 @@ const styles = _reactNative.StyleSheet.create({
     fontSize: 11,
     fontWeight: "700",
     color: _gameUIColors.gameUIColors.primary,
-    fontFamily: "monospace"
+    fontFamily: _fonts.monoFont
   },
   bottomDivider: {
     width: 1,

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

@@ -8,6 +8,7 @@ var _react = require("react");
 var _reactNative = require("react-native");
 var _index = require("../../../icons/index.js");
 var _gameUIColors = require("../constants/gameUIColors.js");
+var _fonts = require("../../fonts.js");
 var _jsxRuntime = require("react/jsx-runtime");
 /**
  * Reusable issues list component with expandable details
@@ -190,18 +191,18 @@ const styles = _reactNative.StyleSheet.create({
   issueKey: {
     fontSize: 11,
     fontWeight: "600",
-    fontFamily: "monospace"
+    fontFamily: _fonts.monoFont
   },
   issueDesc: {
     fontSize: 10,
     color: _gameUIColors.gameUIColors.secondary,
-    fontFamily: "monospace",
+    fontFamily: _fonts.monoFont,
     flex: 1
   },
   hint: {
     fontSize: 9,
     color: _gameUIColors.gameUIColors.muted,
-    fontFamily: "monospace",
+    fontFamily: _fonts.monoFont,
     textAlign: "center",
     marginTop: 8,
     paddingTop: 8,
@@ -230,14 +231,14 @@ const styles = _reactNative.StyleSheet.create({
   detailLabel: {
     fontSize: 10,
     color: _gameUIColors.gameUIColors.secondary,
-    fontFamily: "monospace",
+    fontFamily: _fonts.monoFont,
     fontWeight: "600",
     width: 70
   },
   detailValue: {
     fontSize: 11,
     color: _gameUIColors.gameUIColors.primary,
-    fontFamily: "monospace",
+    fontFamily: _fonts.monoFont,
     flex: 1,
     lineHeight: 16
   },
@@ -252,7 +253,7 @@ const styles = _reactNative.StyleSheet.create({
   fixLabel: {
     fontSize: 10,
     color: _gameUIColors.gameUIColors.info,
-    fontFamily: "monospace",
+    fontFamily: _fonts.monoFont,
     fontWeight: "700",
     marginBottom: 6,
     letterSpacing: 0.5
@@ -260,7 +261,7 @@ const styles = _reactNative.StyleSheet.create({
   fixText: {
     fontSize: 11,
     color: _gameUIColors.gameUIColors.primary,
-    fontFamily: "monospace",
+    fontFamily: _fonts.monoFont,
     lineHeight: 18,
     backgroundColor: _gameUIColors.gameUIColors.background + "66",
     padding: 8,
@@ -276,7 +277,7 @@ const styles = _reactNative.StyleSheet.create({
   descText: {
     fontSize: 10,
     color: _gameUIColors.gameUIColors.secondary,
-    fontFamily: "monospace",
+    fontFamily: _fonts.monoFont,
     marginTop: 4,
     lineHeight: 14
   }

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

@@ -7,6 +7,7 @@ exports.GameUIStatusHeader = GameUIStatusHeader;
 var _reactNative = require("react-native");
 var _absoluteFill = require("../../../utils/absoluteFill.js");
 var _gameUIColors = require("../constants/gameUIColors.js");
+var _fonts = require("../../fonts.js");
 var _jsxRuntime = require("react/jsx-runtime");
 /**
  * Reusable status header component showing system health
@@ -105,7 +106,7 @@ const styles = _reactNative.StyleSheet.create({
   label: {
     fontSize: 13,
     fontWeight: "700",
-    fontFamily: "monospace",
+    fontFamily: _fonts.monoFont,
     letterSpacing: 1.5,
     textShadowOffset: {
       width: 0,
@@ -116,7 +117,7 @@ const styles = _reactNative.StyleSheet.create({
   subtitle: {
     fontSize: 10,
     color: _gameUIColors.gameUIColors.secondary,
-    fontFamily: "monospace"
+    fontFamily: _fonts.monoFont
   },
   badge: {
     paddingHorizontal: 8,
@@ -126,7 +127,7 @@ const styles = _reactNative.StyleSheet.create({
   badgeText: {
     fontSize: 9,
     fontWeight: "700",
-    fontFamily: "monospace",
+    fontFamily: _fonts.monoFont,
     letterSpacing: 1
   },
   indicators: {