@buoy-gg/core 7.0.35 → 7.0.38

package/lib/commonjs/floatingMenu/DevToolsSettingsModal.web.js

@@ -54,6 +54,9 @@ const night = {
   surfaceElevated: '#161618',
   border: '#1A1A1C',
   separator: 'rgba(255, 255, 255, 0.08)',
+  glass: 'rgba(5, 5, 5, 0.50)',
+  glassElevated: 'rgba(255, 255, 255, 0.06)',
+  glassBorder: 'rgba(255, 255, 255, 0.07)',
   fillTertiary: 'rgba(255, 255, 255, 0.12)',
   buttonSurface: 'rgba(8, 10, 14, 0.85)',
   button: '#1C1C1C',
@@ -140,28 +143,6 @@ const Sparkles = ({
   })]
 });
 
-/** Fallback for shared-ui SentryBugIcon (native sentry row icon, red). */
-const AlertTriangle = ({
-  size = 24,
-  color = 'currentColor'
-}) => /*#__PURE__*/(0, _jsxRuntime.jsxs)("svg", {
-  width: size,
-  height: size,
-  viewBox: "0 0 24 24",
-  fill: "none",
-  stroke: color,
-  strokeWidth: "2",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
-    d: "m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3"
-  }), /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
-    d: "M12 9v4"
-  }), /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
-    d: "M12 17h.01"
-  })]
-});
-
 /** shared-ui Info icon (native default tool icon). */
 const Info = ({
   size = 24,
@@ -298,10 +279,9 @@ function ToolIcon({
         size: size
       });
     case 'sentry':
-      // native: SentryBugIcon colorPreset="red" noBackground
-      return /*#__PURE__*/(0, _jsxRuntime.jsx)(AlertTriangle, {
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_floatingToolsCore.SentryIcon, {
         size: size,
-        color: night.danger
+        color: "#9945FF"
       });
     case 'storage':
       // native passes bgColor=night surface for the BIF knock-out parts
@@ -437,11 +417,11 @@ function Footnote({
   });
 }
 
-/** native NightCard: #0C0C0C, radius 14, 1px #1A1A1C, clipped */
+/** native NightCard glass: 50% black, radius 14, 1px white-alpha hairline, clipped */
 const cardStyle = {
-  backgroundColor: night.surface,
+  backgroundColor: night.glass,
   borderRadius: 14,
-  border: `1px solid ${night.border}`,
+  border: `1px solid ${night.glassBorder}`,
   overflow: 'hidden'
 };
 
@@ -786,8 +766,8 @@ function SettingsModal({
   const displayTabs = _floatingToolsReact.settingsTabs.filter(tab => tab.key !== 'pro');
 
   // Segmented control rendered inside the JsModal header — native passes a
-  // NightSegmented as header.customContent the same way. Track = night bg at
-  // radius 10 / padding 3; active thumb = surfaceElevated at radius 8 with
+  // NightSegmented glass as header.customContent the same way. Track = glass
+  // at radius 10 / padding 3; active thumb = glassElevated at radius 8 with
   // the accent underline glow (the Everlights All/Day tabs).
   const tabHeader = /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
     style: {
@@ -802,9 +782,9 @@ function SettingsModal({
       style: {
         flex: 1,
         display: 'flex',
-        backgroundColor: night.bg,
+        backgroundColor: night.glass,
         borderRadius: 10,
-        border: `1px solid ${night.border}`,
+        border: `1px solid ${night.glassBorder}`,
         padding: 3,
         boxSizing: 'border-box'
       },
@@ -822,7 +802,7 @@ function SettingsModal({
             padding: '8px 0',
             borderRadius: 8,
             border: 'none',
-            backgroundColor: isActive ? night.surfaceElevated : 'transparent',
+            backgroundColor: isActive ? night.glassElevated : 'transparent',
             color: isActive ? night.text : night.textSecondary,
             fontSize: 13,
             fontWeight: isActive ? 600 : 500,
@@ -1007,7 +987,7 @@ function SettingsModal({
                     },
                     children: savedKeys.map(key => /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
                       style: {
-                        backgroundColor: night.surfaceElevated,
+                        backgroundColor: night.glassElevated,
                         borderRadius: 8,
                         padding: '7px 10px',
                         marginBottom: 4

package/lib/commonjs/floatingMenu/FloatingDevTools.js

@@ -4,6 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.FloatingDevTools = void 0;
+var _sharedUi = require("@buoy-gg/shared-ui");
 var _react = _interopRequireWildcard(require("react"));
 var _reactNative = require("react-native");
 var _AppHost = require("./AppHost");
@@ -12,10 +13,9 @@ var _ToolOpenerBridge = require("./ToolOpenerBridge.js");
 var _autoDiscoverPresets = require("./autoDiscoverPresets.js");
 var _installPing = require("../telemetry/installPing.js");
 var _Buoy = require("../Buoy.js");
-var _AppIcon = require("./AppIcon.js");
+var _AppIcon = require("./AppIcon");
 var _DevToolsVisibilityContext = require("./DevToolsVisibilityContext.js");
 var _optionalRequire = require("./optionalRequire.js");
-var _sharedUi = require("@buoy-gg/shared-ui");
 var _MinimizedToolsContext = require("./MinimizedToolsContext.js");
 var _defaultConfig = require("./defaultConfig.js");
 var _DefaultConfigContext = require("./DefaultConfigContext.js");
@@ -124,7 +124,7 @@ const FloatingDevTools = ({
   disableHints = false,
   defaultFloatingTools,
   defaultDialTools,
-  requireLicense = false,
+  requireLicense: _requireLicense,
   licenseKey: licenseKeyProp,
   zustandStores,
   environment,
@@ -142,24 +142,27 @@ const FloatingDevTools = ({
     isLicensed
   } = (0, _license.useProAccess)();
 
-  // Get full license state for requireLicense gating
+  // Account admission is mandatory; paid feature gates remain separate.
   const {
     licenseKey,
     isInitialized,
-    tier
+    tier,
+    access
   } = (0, _license.useLicense)();
+  const configuredMatches = licenseKeyProp === undefined || licenseKeyProp.trim().toUpperCase() === (licenseKey ?? "");
+  const accountAdmitted = configuredMatches && access.status === "admitted";
 
   // Anonymous install ping — dev-only, once a day, no project or tool data.
-  // Deliberately waits for the license to resolve so the tier it reports is
-  // the real one rather than the "anonymous" the manager starts at.
+  // Deliberately waits for admission to resolve so what it reports is the
+  // real outcome (the account's tier, or "locked") rather than the manager's
+  // starting state.
   (0, _react.useEffect)(() => {
-    if (!isInitialized) return;
+    if (!isInitialized || access.status === "initializing") return;
     void (0, _installPing.sendInstallPing)({
-      tier,
+      tier: access.status === "admitted" ? tier : "locked",
       enabled: (0, _Buoy.isTelemetryEnabled)()
     });
-  }, [isInitialized, tier]);
-  const [showLicenseModal, setShowLicenseModal] = (0, _react.useState)(false);
+  }, [isInitialized, access.status, tier]);
 
   // Initialize license manager on mount, and set/clear license key when prop changes.
   // The `licenseKey` prop is the source of truth WHEN PROVIDED:
@@ -167,28 +170,12 @@ const FloatingDevTools = ({
   //   - "" (blank) → EXPLICITLY clear the cached license (key was removed)
   //   - undefined  → don't touch it (the app may set a key via Buoy.init())
   (0, _react.useEffect)(() => {
-    if (licenseKeyProp && licenseKeyProp.trim() !== "") {
-      _license.LicenseManager.initialize().then(() => _license.LicenseManager.setLicenseKey(licenseKeyProp)).catch(() => {});
-    } else if (licenseKeyProp === "") {
-      // Explicit removal: wipe the 30-day cache so Pro actually turns off.
-      _license.LicenseManager.initialize().then(() => _license.LicenseManager.clearLicense()).catch(() => {});
-    } else {
-      _license.LicenseManager.initialize();
-    }
+    void _license.LicenseManager.configure(licenseKeyProp).catch(() => {});
   }, [licenseKeyProp]);
 
-  // Show license modal if requireLicense is enabled and no valid license
-  (0, _react.useEffect)(() => {
-    if (requireLicense && isInitialized && !licenseKey) {
-      setShowLicenseModal(true);
-    } else if (licenseKey) {
-      setShowLicenseModal(false);
-    }
-  }, [requireLicense, isInitialized, licenseKey]);
-
   // Register zustand stores once on mount if provided
   (0, _react.useEffect)(() => {
-    if (!zustandStores) return;
+    if (!zustandStores || access.status === "locked") return;
     try {
       const {
         watchStores
@@ -197,7 +184,7 @@ const FloatingDevTools = ({
     } catch (e) {
       (0, _optionalRequire.reportOptionalRequireError)("@buoy-gg/zustand", e);
     }
-  }, []); // eslint-disable-line react-hooks/exhaustive-deps
+  }, [zustandStores, access.status]);
 
   // Normalize dial tools configuration (truncates to max 6 with warning if needed)
   const normalizedDialTools = (0, _react.useMemo)(() => {
@@ -454,17 +441,16 @@ const FloatingDevTools = ({
 
   // Gate: only a PAID license works outside development.
   //
-  // Both untiered surfaces below it — anonymous (no key) and free (a key on the
-  // Free policy) — stay dev-only. `isLicensed` is safe to gate on because
-  // `isPro` is a strict mirror of `tier === "pro"`, so a free key reports false
-  // here even though it validates perfectly well.
+  // A free key (and, of course, no key at all) stays dev-only. `isLicensed` is
+  // safe to gate on because `isPro` is a strict mirror of `tier === "pro"`, so
+  // a free key reports false here even though it validates perfectly well.
   //
   // When Business on-device login lands, this becomes the boundary that a
   // logged-in QA/support seat crosses WITHOUT a key in the build — i.e.
   // `isLicensed || tierSource === "session"`. Nothing else should.
   const isDevelopment = typeof __DEV__ !== "undefined" && __DEV__;
   if (!isDevelopment && !isLicensed) {
-    // Anonymous or free user in production - don't render DevTools.
+    // Free or unadmitted user in production - don't render DevTools.
     // NOTE for whoever relaxes this for the free tier: desktop sync does NOT
     // ride on this check. It re-tests `isLicensed` itself (externalSyncGate),
     // so opening this door does not open a broker socket. Keep it that way.
@@ -491,10 +477,16 @@ const FloatingDevTools = ({
     requiredEnvVars: requiredEnvVars,
     customApps: syncApps
   });
+  if (!accountAdmitted) {
+    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+      children: [access.status === "initializing" && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+        children: [ReduxAutoInstrument && /*#__PURE__*/(0, _jsxRuntime.jsx)(ReduxAutoInstrument, {}), ConsoleRoot && /*#__PURE__*/(0, _jsxRuntime.jsx)(ConsoleRoot, {}), RouteTracker && /*#__PURE__*/(0, _jsxRuntime.jsx)(RouteTracker, {}), ReactQueryTracker && /*#__PURE__*/(0, _jsxRuntime.jsx)(ReactQueryTracker, {})]
+      }), !headless && /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.AccountSetup, {})]
+    });
+  }
 
   // Headless (sync-only): tool adapters + route tracking + desktop sync, no
-  // on-device UI. requireLicense is intentionally skipped — there's nothing
-  // to gate. All hooks above already ran, so hook order is preserved, and
+  // on-device UI. Account admission above applies to this path too. All hooks above already ran, so hook order is preserved, and
   // AutoExternalSync still obeys `syncEnabled` (the broker must never be
   // contacted from a shipped build that didn't ask for it).
   if (headless) {
@@ -510,16 +502,6 @@ const FloatingDevTools = ({
     });
   }
 
-  // Gate: If requireLicense is enabled and no license, show only the license modal
-  if (requireLicense && isInitialized && !licenseKey) {
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.LicenseEntryModal, {
-      visible: showLicenseModal,
-      onClose: () => {} // Can't close without entering a license
-      ,
-      onSuccess: () => setShowLicenseModal(false)
-    });
-  }
-
   // Session blocking is handled inline by JsModal's SessionBlockedOverlay
   // No need to replace the entire UI - tools still render, but content is blocked
 
@@ -542,7 +524,9 @@ const FloatingDevTools = ({
                 ...props,
                 apps: finalApps,
                 environment: resolvedEnvironment
-              }), props.hidden ? null : /*#__PURE__*/(0, _jsxRuntime.jsx)(_AppHost.AppOverlay, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ToolOpenerBridge.ToolOpenerBridge, {})]
+              }), props.hidden ? null : /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+                children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_AppHost.AppOverlay, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.FloatingToolHost, {})]
+              }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ToolOpenerBridge.ToolOpenerBridge, {})]
             })
           }), children, DebugBordersOverlay && /*#__PURE__*/(0, _jsxRuntime.jsx)(DebugBordersOverlay, {}), HighlightUpdatesOverlay && /*#__PURE__*/(0, _jsxRuntime.jsx)(HighlightUpdatesOverlay, {}), ImageOverlayOverlay && /*#__PURE__*/(0, _jsxRuntime.jsx)(ImageOverlayOverlay, {}), PerfMonitorOverlay && /*#__PURE__*/(0, _jsxRuntime.jsx)(PerfMonitorOverlay, {}), JsTopOverlay && /*#__PURE__*/(0, _jsxRuntime.jsx)(JsTopOverlay, {}), ImpersonateOverlay && /*#__PURE__*/(0, _jsxRuntime.jsx)(ImpersonateOverlay, {}), ScenariosOverlay && /*#__PURE__*/(0, _jsxRuntime.jsx)(ScenariosOverlay, {}), ReduxAutoInstrument && /*#__PURE__*/(0, _jsxRuntime.jsx)(ReduxAutoInstrument, {}), ConsoleRoot && /*#__PURE__*/(0, _jsxRuntime.jsx)(ConsoleRoot, {}), RouteTracker && /*#__PURE__*/(0, _jsxRuntime.jsx)(RouteTracker, {}), ReactQueryTracker && /*#__PURE__*/(0, _jsxRuntime.jsx)(ReactQueryTracker, {}), toolRegistry, syncEnabled && /*#__PURE__*/(0, _jsxRuntime.jsx)(_autoExternalSync.AutoExternalSync, {
             options: (0, _externalSyncGate.externalSyncOptions)(externalSync),

package/lib/commonjs/floatingMenu/FloatingDevTools.web.js

@@ -4,9 +4,11 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.FloatingDevTools = FloatingDevTools;
+var _floating = require("@buoy-gg/shared-ui/floating");
+var _license = require("@buoy-gg/license");
+var _sharedUi = require("@buoy-gg/shared-ui");
 var _react = require("react");
 var _floatingToolsReact = require("@buoy-gg/floating-tools-react");
-var _sharedUi = require("@buoy-gg/shared-ui");
 var _autoDiscoverPresetsWeb = require("../utils/autoDiscoverPresets.web.js");
 var _floatingToolsWeb = require("./floatingTools.web.js");
 var _DialDevToolsWeb = require("./dial/DialDevTools.web.js");
@@ -87,7 +89,7 @@ function MenuLauncherIcon({
 // Main Component
 // =============================
 
-function FloatingDevTools(props) {
+function AdmittedFloatingDevTools(props) {
   // The tool host wraps everything so dial presses can open tool components
   // into the AppOverlay (web twin of the native AppHostProvider/AppOverlay).
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_AppHostWeb.AppHostProvider, {
@@ -372,10 +374,28 @@ function FloatingDevToolsInner({
       onSettingsChange: _newSettings => {
         // Settings are already saved by the hook
       }
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_AppHostWeb.AppOverlay, {})]
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_AppHostWeb.AppOverlay, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_floating.FloatingToolHost, {})]
   });
 }
 
 // =============================
 // Re-exports for convenience
-// =============================
+// =============================
+
+function FloatingDevTools(props) {
+  const {
+    access,
+    isPro,
+    licenseKey
+  } = (0, _license.useLicense)();
+  (0, _react.useEffect)(() => {
+    void _license.LicenseManager.configure(props.licenseKey);
+  }, [props.licenseKey]);
+  const matches = props.licenseKey === undefined || props.licenseKey.trim().toUpperCase() === (licenseKey ?? "");
+  const dev = typeof __DEV__ !== "undefined" ? __DEV__ : process.env.NODE_ENV !== "production";
+  if (!dev && !isPro) return null;
+  if (!matches || access.status !== "admitted") return props.headless ? null : /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.AccountSetup, {});
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(AdmittedFloatingDevTools, {
+    ...props
+  });
+}

package/lib/commonjs/floatingMenu/FloatingMenu.js

@@ -8,7 +8,7 @@ var _react = _interopRequireWildcard(require("react"));
 var _reactNative = require("react-native");
 var _sharedUi = require("@buoy-gg/shared-ui");
 var _floatingTools = require("./floatingTools");
-var _AppIcon = require("./AppIcon.js");
+var _AppIcon = require("./AppIcon");
 var _DialDevTools = require("./dial/DialDevTools");
 var _DevToolsSettingsModal = require("./DevToolsSettingsModal");
 var _AppHost = require("./AppHost");

package/lib/commonjs/floatingMenu/MinimizedToolsStack.js

@@ -10,9 +10,50 @@ var _sharedUi = require("@buoy-gg/shared-ui");
 var _MinimizedToolsContext = require("./MinimizedToolsContext.js");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+/**
+ * A hidden tool's "I need you". See `setToolAttention` in shared-ui — the tool
+ * publishes, the rail draws. Read through useSyncExternalStore so a badge set
+ * from inside a minimized sheet lands on the chip without the rail polling.
+ */function useToolAttention(toolId) {
+  return (0, _react.useSyncExternalStore)(_sharedUi.subscribeToolAttention, () => (0, _sharedUi.getToolAttention)(toolId), () => (0, _sharedUi.getToolAttention)(toolId));
+}
+const ATTENTION_COLORS = {
+  needsInput: "#FF8329",
+  done: "#20C997",
+  failed: "#FF3B30"
+};
+
+/** needsInput outranks failed outranks done — the peek shows the one that matters most. */
+const ATTENTION_RANK = {
+  needsInput: 3,
+  failed: 2,
+  done: 1
+};
+
+/** The strongest attention across every minimized tool, for the folded peek. */
+function useStrongestAttention(toolIds) {
+  const key = toolIds.join("|");
+  return (0, _react.useSyncExternalStore)(_sharedUi.subscribeToolAttention, () => strongest(key), () => strongest(key));
+}
+const strongestCache = new Map();
+function strongest(key) {
+  let best = null;
+  for (const id of key ? key.split("|") : []) {
+    const a = (0, _sharedUi.getToolAttention)(id);
+    if (a && (!best || ATTENTION_RANK[a.kind] > ATTENTION_RANK[best.kind])) best = a;
+  }
+  // Same value → same object, or useSyncExternalStore re-renders forever.
+  const prev = strongestCache.get(key);
+  if (prev && best && prev.kind === best.kind && prev.label === best.label) return prev;
+  if (!prev && !best) return null;
+  strongestCache.set(key, best);
+  return best;
+}
+
 // ============================================================================
 // Constants
 // ============================================================================
+
 const PEEK_HEIGHT = 28;
 const TOOLBAR_WIDTH = 44;
 const TOOL_ITEM_SIZE = 32;
@@ -35,6 +76,7 @@ function GlitchToolButton({
   onSelect,
   index
 }) {
+  const attention = useToolAttention(tool.id);
   const glitchX = (0, _react.useRef)(new _reactNative.Animated.Value(0)).current;
   const glitchOpacity = (0, _react.useRef)(new _reactNative.Animated.Value(1)).current;
   const glitchScale = (0, _react.useRef)(new _reactNative.Animated.Value(1)).current;
@@ -126,14 +168,14 @@ function GlitchToolButton({
       clearTimeout(timeoutId);
     };
   }, [glitchX, glitchOpacity, glitchScale, index]);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TouchableOpacity, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.TouchableOpacity, {
     onPress: () => onSelect(tool),
     activeOpacity: 0.7,
     style: styles.toolButton,
-    accessibilityLabel: `Restore ${tool.title}`,
+    accessibilityLabel: attention ? `${tool.title} — ${attention.label}. Restore` : `Restore ${tool.title}`,
     accessibilityRole: "button",
     testID: `buoy-dock-restore-${tool.id}`,
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Animated.View, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Animated.View, {
       style: {
         opacity: glitchOpacity,
         transform: [{
@@ -143,7 +185,17 @@ function GlitchToolButton({
         }]
       },
       children: tool.icon
-    })
+    }), attention ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      style: [styles.badge, {
+        backgroundColor: ATTENTION_COLORS[attention.kind]
+      }],
+      testID: `buoy-dock-badge-${tool.id}-${attention.kind}`,
+      pointerEvents: "none",
+      children: attention.kind === "needsInput" ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+        style: styles.badgeText,
+        children: "!"
+      }) : null
+    }) : null]
   });
 }
 
@@ -163,6 +215,7 @@ function MinimizedToolsStack({
     minimizedTools,
     restore
   } = (0, _MinimizedToolsContext.useMinimizedTools)();
+  const peekAttention = useStrongestAttention(minimizedTools.map(t => t.id));
 
   // Calculate expanded height based on number of tools
   const expandedHeight = TOOLBAR_PADDING + minimizedTools.length * TOOL_ITEM_SIZE + (minimizedTools.length - 1) * ICON_GAP + ICON_GAP + COLLAPSE_BUTTON_SIZE + 4;
@@ -186,6 +239,11 @@ function MinimizedToolsStack({
     collapsedLabel: `Show ${minimizedTools.length} minimized tools`,
     testID: "buoy-dock-peek",
     collapseTestID: "buoy-dock-collapse",
+    attention: peekAttention ? {
+      color: ATTENTION_COLORS[peekAttention.kind],
+      glyph: peekAttention.kind === "needsInput" ? "!" : undefined,
+      label: peekAttention.label
+    } : null,
     children: [...minimizedTools].reverse().map((tool, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(GlitchToolButton, {
       tool: tool,
       onSelect: handleToolPress,
@@ -205,5 +263,26 @@ const styles = _reactNative.StyleSheet.create({
     alignItems: "center",
     justifyContent: "center",
     backgroundColor: "transparent"
+  },
+  // Top-right of the chip. Needs-input carries a glyph; done/failed are a dot —
+  // the colour says which, the glyph says "act".
+  badge: {
+    position: "absolute",
+    top: 0,
+    right: 0,
+    minWidth: 12,
+    height: 12,
+    borderRadius: 6,
+    paddingHorizontal: 2,
+    alignItems: "center",
+    justifyContent: "center",
+    borderWidth: 1.5,
+    borderColor: "#0C0C0C"
+  },
+  badgeText: {
+    color: "#000",
+    fontSize: 8,
+    fontWeight: "800",
+    lineHeight: 9
   }
 });

package/lib/commonjs/floatingMenu/MinimizedToolsStack.web.js

@@ -24,6 +24,39 @@ var _jsxRuntime = require("react/jsx-runtime");
  * used before this replaced it.
  */
 
+/** Twin of the native hook — see MinimizedToolsStack.tsx. */
+function useToolAttention(toolId) {
+  return (0, _react.useSyncExternalStore)(_sharedUi.subscribeToolAttention, () => (0, _sharedUi.getToolAttention)(toolId), () => (0, _sharedUi.getToolAttention)(toolId));
+}
+const ATTENTION_COLORS = {
+  needsInput: '#FF8329',
+  done: '#20C997',
+  failed: '#FF3B30'
+};
+const ATTENTION_RANK = {
+  needsInput: 3,
+  failed: 2,
+  done: 1
+};
+const strongestCache = new Map();
+function strongest(key) {
+  let best = null;
+  for (const id of key ? key.split('|') : []) {
+    const a = (0, _sharedUi.getToolAttention)(id);
+    if (a && (!best || ATTENTION_RANK[a.kind] > ATTENTION_RANK[best.kind])) best = a;
+  }
+  const prev = strongestCache.get(key);
+  if (prev && best && prev.kind === best.kind && prev.label === best.label) return prev;
+  if (!prev && !best) return null;
+  strongestCache.set(key, best);
+  return best;
+}
+/** Twin of the native hook: the strongest attention across the folded dock. */
+function useStrongestAttention(toolIds) {
+  const key = toolIds.join('|');
+  return (0, _react.useSyncExternalStore)(_sharedUi.subscribeToolAttention, () => strongest(key), () => strongest(key));
+}
+
 // native MinimizedToolsStack.tsx constants
 const PEEK_HEIGHT = 28;
 const TOOL_ITEM_SIZE = 32;
@@ -61,11 +94,13 @@ function ChevronGlyph({
   });
 }
 function GlitchToolButton({
+  id,
   title,
   icon,
   index,
   onPress
 }) {
+  const attention = useToolAttention(id);
   const innerRef = (0, _react.useRef)(null);
   (0, _react.useEffect)(() => {
     let mounted = true;
@@ -116,9 +151,9 @@ function GlitchToolButton({
       clearTimeout(timer);
     };
   }, [index]);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("button", {
     type: "button",
-    "aria-label": `Restore ${title}`,
+    "aria-label": attention ? `${title} — ${attention.label}. Restore` : `Restore ${title}`,
     onClick: onPress,
     style: {
       width: TOOL_ITEM_SIZE,
@@ -129,9 +164,10 @@ function GlitchToolButton({
       background: 'none',
       border: 'none',
       padding: 0,
-      cursor: 'pointer'
+      cursor: 'pointer',
+      position: 'relative'
     },
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       ref: innerRef,
       style: {
         display: 'flex',
@@ -139,7 +175,30 @@ function GlitchToolButton({
         justifyContent: 'center'
       },
       children: icon
-    })
+    }), attention ? /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+      "aria-hidden": true,
+      "data-testid": `buoy-dock-badge-${id}-${attention.kind}`,
+      style: {
+        position: 'absolute',
+        top: 0,
+        right: 0,
+        minWidth: 12,
+        height: 12,
+        borderRadius: 6,
+        padding: '0 2px',
+        boxSizing: 'border-box',
+        background: ATTENTION_COLORS[attention.kind],
+        border: '1.5px solid #0C0C0C',
+        color: '#000',
+        fontSize: 8,
+        fontWeight: 800,
+        lineHeight: '9px',
+        display: 'flex',
+        alignItems: 'center',
+        justifyContent: 'center'
+      },
+      children: attention.kind === 'needsInput' ? '!' : ''
+    }) : null]
   });
 }
 function MinimizedToolsStack({
@@ -152,6 +211,7 @@ function MinimizedToolsStack({
   const minimized = openApps.filter(app => app.minimized && app.launchMode !== 'toggle-only');
   const [isExpanded, setIsExpanded] = (0, _react.useState)(false);
   const [isStateRestored, setIsStateRestored] = (0, _react.useState)(false);
+  const peekAttention = useStrongestAttention(minimized.map(app => app.id));
 
   // Restore + persist the expanded flag (native ExpandablePopover persistState).
   (0, _react.useEffect)(() => {
@@ -219,6 +279,7 @@ function MinimizedToolsStack({
           boxSizing: 'border-box'
         },
         children: [[...minimized].reverse().map((app, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(GlitchToolButton, {
+          id: app.id,
           title: app.title || app.id,
           icon: app.icon ?? /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
             style: {
@@ -273,7 +334,30 @@ function MinimizedToolsStack({
         pointerEvents: isExpanded ? 'none' : 'auto',
         ...frame
       },
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(ChevronGlyph, {}), minimized.length > 1 && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(ChevronGlyph, {}), peekAttention ? /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        "aria-hidden": true,
+        "data-testid": `buoy-dock-peek-attention`,
+        style: {
+          position: 'absolute',
+          top: 2,
+          right: 2,
+          minWidth: 11,
+          height: 11,
+          borderRadius: 6,
+          padding: '0 2px',
+          boxSizing: 'border-box',
+          background: ATTENTION_COLORS[peekAttention.kind],
+          border: '1.5px solid #0C0C0C',
+          color: '#000',
+          fontSize: 8,
+          fontWeight: 800,
+          lineHeight: '9px',
+          display: 'flex',
+          alignItems: 'center',
+          justifyContent: 'center'
+        },
+        children: peekAttention.kind === 'needsInput' ? '!' : ''
+      }) : null, minimized.length > 1 && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
         style: {
           fontSize: 9,
           fontWeight: 600,

package/lib/commonjs/floatingMenu/ToolHost.js

@@ -197,6 +197,7 @@ function ToolModalShell({
       subtitle: subtitle
     }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_sharedUi.ModalHeader.Actions, {
       children: [!isSearchActive && actions, searchable && !isSearchActive && /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.HeaderSearchButton, {
+        variant: "chip",
         testID: `tool-search-${app.id}`,
         onPress: () => setIsSearchActive(true)
       })]

package/lib/commonjs/floatingMenu/autoExternalSync.js

@@ -9,6 +9,7 @@ exports.isExternalSyncAvailable = isExternalSyncAvailable;
 exports.useToolAdapterMap = useToolAdapterMap;
 var _react = require("react");
 var _reactNative = require("react-native");
+var _license = require("@buoy-gg/license");
 var _optionalRequire = require("./optionalRequire.js");
 var _appSyncAdapter = require("./sync/appSyncAdapter.js");
 var _deviceIdentity = require("./deviceIdentity.js");
@@ -292,11 +293,11 @@ function AutoExternalSync({
   (0, _react.useEffect)(() => {
     if (!socket) return;
     const emitLicense = () => {
+      if (!_license.LicenseManager.hasAccountAccess() || !socket.connected) return;
       socket.emit("device-license", {
         isPro: licenseRef.current.isPro ? "1" : "0",
         // Brokers older than the tier split ignore this; newer ones prefer it.
-        tier: licenseRef.current.tier ?? (licenseRef.current.isPro ? "pro" : "anonymous"),
-        licenseKey: licenseRef.current.licenseKey ?? ""
+        tier: licenseRef.current.tier ?? (licenseRef.current.isPro ? "pro" : "free")
       });
     };
     if (socket.connected) emitLicense();