@buoy-gg/core 7.0.40 → 7.0.41

package/lib/commonjs/floatingMenu/FloatingDevTools.js

@@ -517,7 +517,12 @@ const FloatingDevTools = ({
         ,
         __buoyDevToolsRoot: true,
         children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_DevToolsVisibilityContext.DevToolsVisibilityProvider, {
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_AppHost.AppHostProvider, {
+          children: [ImageOverlayOverlay && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+            style: _reactNative.StyleSheet.absoluteFill,
+            pointerEvents: "box-none",
+            collapsable: false,
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(ImageOverlayOverlay, {})
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_AppHost.AppHostProvider, {
             children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_MinimizedToolsContext.MinimizedToolsProvider, {
               getToolIcon: getToolIcon,
               children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_FloatingMenu.FloatingMenu, {
@@ -528,7 +533,7 @@ const FloatingDevTools = ({
                 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, {
+          }), children, DebugBordersOverlay && /*#__PURE__*/(0, _jsxRuntime.jsx)(DebugBordersOverlay, {}), HighlightUpdatesOverlay && /*#__PURE__*/(0, _jsxRuntime.jsx)(HighlightUpdatesOverlay, {}), 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),
             requiredEnvVars: requiredEnvVars,
             isPro: isLicensed,

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

@@ -17,36 +17,15 @@ var _OnboardingTooltipWeb = require("./dial/OnboardingTooltip.web.js");
 var _DevToolsSettingsModalWeb = require("./DevToolsSettingsModal.web.js");
 var _AppHostWeb = require("./AppHost.web.js");
 var _MinimizedToolsStackWeb = require("./MinimizedToolsStack.web.js");
+var _createWebTools = require("../utils/createWebTools.js");
+var _BrowserToolRuntime = require("./BrowserToolRuntime.js");
+var _DevToolsVisibilityContext = require("./DevToolsVisibilityContext.js");
 var _jsxRuntime = require("react/jsx-runtime");
-/**
- * FloatingDevTools - Unified dev tools component for React DOM Web.
- *
- * Matches the mobile FloatingDevTools API exactly:
- * - Self-contained (doesn't wrap your app)
- * - Auto-discovers installed tool packages
- * - Manages dial menu and settings modal state internally
- *
- * Usage (same as mobile):
- * ```tsx
- * <>
- *   <YourApp />
- *   <FloatingDevTools environment="qa" userRole="admin" />
- * </>
- * ```
- *
- * @platform React DOM Web (Vite, CRA, Next.js, Electron)
- */
+const EMPTY_MODULES = {};
 
 // native FloatingMenu.tsx TOOLTIP_SHOWN_KEY
 const MENU_TOOLTIP_KEY = '@react_buoy_floating_menu_tooltip_shown';
-
-// Same localStorage adapter the settings modal uses — without it, useSettings
-// never loads persisted settings and this instance sits on defaults across
-// launches (live changes still arrive via the settings event bus).
-const webSettingsStorage = {
-  getItem: key => localStorage.getItem(key),
-  setItem: (key, value) => localStorage.setItem(key, value)
-};
+const webSettingsStorage = _sharedUi.persistentStorage;
 
 // =============================
 // Types
@@ -92,9 +71,11 @@ function MenuLauncherIcon({
 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, {
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(FloatingDevToolsInner, {
-      ...props
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_DevToolsVisibilityContext.DevToolsVisibilityProvider, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_AppHostWeb.AppHostProvider, {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(FloatingDevToolsInner, {
+        ...props
+      })
     })
   });
 }
@@ -104,6 +85,10 @@ function FloatingDevToolsInner({
   availableEnvironments,
   onEnvironmentSwitch,
   apps,
+  modules = EMPTY_MODULES,
+  externalSync,
+  requiredEnvVars,
+  sentryGetClient,
   disableHints = false,
   headless = false
 }) {
@@ -114,7 +99,15 @@ function FloatingDevToolsInner({
   const appHost = (0, _AppHostWeb.useAppHost)();
 
   // Auto-discover tools and merge with custom apps
-  const tools = (0, _react.useMemo)(() => (0, _autoDiscoverPresetsWeb.autoDiscoverWithCustom)(apps), [apps]);
+  const tools = (0, _react.useMemo)(() => (0, _autoDiscoverPresetsWeb.autoDiscoverWithCustom)([...(0, _createWebTools.createWebTools)(modules), ...(apps ?? [])]), [apps, modules]);
+  const visibility = (0, _DevToolsVisibilityContext.useDevToolsVisibility)();
+  const toolVisible = appHost.openApps.some(app => !app.minimized);
+  (0, _react.useEffect)(() => {
+    visibility.setDialOpen(isDialOpen);
+  }, [isDialOpen, visibility.setDialOpen]);
+  (0, _react.useEffect)(() => {
+    visibility.setToolOpen(toolVisible || isSettingsOpen);
+  }, [toolVisible, isSettingsOpen, visibility.setToolOpen]);
 
   // Let the host restore `@react_buoy_open_apps` from the previous session
   // once it knows which tools exist (native registerApps parity).
@@ -122,7 +115,15 @@ function FloatingDevToolsInner({
     registerApps
   } = appHost;
   (0, _react.useEffect)(() => {
-    registerApps(tools);
+    registerApps(tools.map(tool => {
+      const icon = tool.icon;
+      return {
+        ...tool,
+        icon: typeof icon === 'function' ? ({
+          size
+        }) => icon(size) : icon
+      };
+    }));
   }, [registerApps, tools]);
 
   // Convert to available tools config for settings
@@ -173,6 +174,10 @@ function FloatingDevToolsInner({
   // Shared open path for dial + bubble-row tools.
   const openTool = (0, _react.useCallback)(tool => {
     void (0, _dialUsageStore.recordToolUsage)(tool.id);
+    if (tool.launchMode === 'toggle-only') {
+      tool.onPress?.();
+      return;
+    }
     if (tool.component) {
       const dockIcon = typeof tool.icon === 'function' ? tool.icon(20) : tool.icon;
       appHost.open({
@@ -180,6 +185,7 @@ function FloatingDevToolsInner({
         title: tool.name || (0, _floatingToolsReact.getToolLabel)(tool.id),
         component: tool.component,
         props: tool.props,
+        modal: tool.modal,
         launchMode: tool.launchMode || 'self-modal',
         singleton: tool.singleton ?? true,
         icon: dockIcon,
@@ -274,9 +280,9 @@ function FloatingDevToolsInner({
   // Callbacks
   const handleOpenDial = (0, _react.useCallback)(() => {
     // Opening the dial dismisses the welcome tooltip (native handleDialOpen).
-    if (showWelcomeTooltip) dismissWelcomeTooltip();
+    dismissWelcomeTooltip();
     setIsDialOpen(true);
-  }, [showWelcomeTooltip, dismissWelcomeTooltip]);
+  }, [dismissWelcomeTooltip]);
   const handleCloseDial = (0, _react.useCallback)(() => {
     setIsDialOpen(false);
     setIsSettingsOpen(false); // settings lives above the dial
@@ -291,13 +297,21 @@ function FloatingDevToolsInner({
   const environmentEnabled = settings.floatingTools.environment !== false;
   const welcomeActive = showWelcomeTooltip && !isDialOpen && !isAnyToolOpen;
   const hasMinimizedTools = appHost.openApps.some(app => app.minimized && app.launchMode !== 'toggle-only');
-
-  // Headless: desktop sync is native-only, so there is nothing to mount on
-  // web — accept the prop for API parity and render nothing. (After all
-  // hooks so hook order is preserved.)
-  if (headless) return null;
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-    children: [welcomeActive && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+  const runtime = /*#__PURE__*/(0, _jsxRuntime.jsx)(_BrowserToolRuntime.BrowserToolRuntime, {
+    modules: modules,
+    apps: apps,
+    requiredEnvVars: requiredEnvVars,
+    externalSync: externalSync,
+    headless: headless,
+    sentryGetClient: sentryGetClient
+  });
+  if (headless) return runtime;
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    "data-buoy-root": "",
+    style: {
+      display: 'contents'
+    },
+    children: [runtime, welcomeActive && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       style: {
         position: 'fixed',
         inset: 0,

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

@@ -258,12 +258,16 @@ function MinimizedToolsStack({
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       style: {
         position: 'absolute',
-        bottom: 0,
+        bottom: 'var(--buoy-stack-bottom, 0px)',
+        top: 'var(--buoy-stack-top, auto)',
         left: 0,
         width: containerWidth,
+        maxHeight: 'var(--buoy-stack-space, calc(100vh - 48px))',
+        visibility: isExpanded ? 'visible' : 'hidden',
         height: isExpanded ? expandedHeight : 0,
         opacity: isExpanded ? 1 : 0,
-        overflow: 'hidden',
+        overflowY: 'auto',
+        overflowX: 'hidden',
         transition: 'height 200ms ease, opacity 200ms ease',
         pointerEvents: isExpanded ? 'auto' : 'none',
         ...frame
@@ -314,6 +318,8 @@ function MinimizedToolsStack({
     }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("button", {
       type: "button",
       "aria-label": `Show ${minimized.length} minimized tools`,
+      tabIndex: isExpanded ? -1 : 0,
+      "aria-hidden": isExpanded,
       onClick: () => setIsExpanded(true),
       style: {
         position: 'absolute',

package/lib/commonjs/floatingMenu/autoDiscoverPresets.js

@@ -188,6 +188,16 @@ function autoDiscoverPresets() {
         return null;
       }
     }
+  }, {
+    name: "@buoy-gg/notifications",
+    loader: () => {
+      try {
+        return require("@buoy-gg/notifications").notificationToolPreset;
+      } catch (e) {
+        (0, _optionalRequire.reportOptionalRequireError)("@buoy-gg/notifications", e);
+        return null;
+      }
+    }
   },
   // Sentry
   {

package/lib/commonjs/floatingMenu/autoExternalSync.js

@@ -53,6 +53,12 @@ let jotaiModule = null;
 let eventsModule = null;
 let consoleModule = null;
 let sentryModule = null;
+let notificationsModule = null;
+try {
+  notificationsModule = require("@buoy-gg/notifications");
+} catch (e) {
+  (0, _optionalRequire.reportOptionalRequireError)("@buoy-gg/notifications", e);
+}
 let envModule = null;
 let highlightUpdatesModule = null;
 let debugBordersModule = null;
@@ -355,6 +361,9 @@ function useToolAdapterMapInner(queryAdapter, requiredEnvVars, customApps) {
     if (consoleModule?.consoleSyncAdapter) {
       map.console = consoleModule.consoleSyncAdapter;
     }
+    if (notificationsModule?.notificationSyncAdapter) {
+      map["push-notifications"] = notificationsModule.notificationSyncAdapter;
+    }
     if (sentryModule?.sentrySyncAdapter) {
       map.sentry = sentryModule.sentrySyncAdapter;
     }

package/lib/commonjs/floatingMenu/dial/DialDevTools.web.js

@@ -7,6 +7,7 @@ exports.DialMenu = DialMenu;
 var _react = require("react");
 var _floatingToolsReact = require("@buoy-gg/floating-tools-react");
 var _sharedUi = require("@buoy-gg/shared-ui");
+var _DialHyperspace = require("./DialHyperspace.js");
 var _OnboardingTooltipWeb = require("./OnboardingTooltip.web.js");
 var _jsxRuntime = require("react/jsx-runtime");
 /**
@@ -21,6 +22,11 @@ var _jsxRuntime = require("react/jsx-runtime");
  * @platform React DOM Web (Vite, CRA, Next.js, Electron)
  */
 
+const DIAL_BACKGROUND_FOCUS = {
+  x: 0.5,
+  y: 0.5
+};
+
 // native DialDevTools.tsx SETTINGS_TOOLTIP_KEY
 const SETTINGS_TOOLTIP_KEY = '@react_buoy_settings_tooltip_shown';
 
@@ -294,6 +300,10 @@ function DialMenu({
   settingsOpen = false,
   hintsDisabled = false
 }) {
+  const {
+    id: backgroundId
+  } = (0, _sharedUi.useToolBackground)();
+
   // Animation values
   const [backdropOpacity, setBackdropOpacity] = (0, _react.useState)(0);
   const [dialScale, setDialScale] = (0, _react.useState)(0);
@@ -308,6 +318,8 @@ function DialMenu({
   const [entranceComplete, setEntranceComplete] = (0, _react.useState)(false);
 
   // Refs
+  const dialogRef = (0, _react.useRef)(null);
+  const centerRef = (0, _react.useRef)(null);
   const animationRef = (0, _react.useRef)(null);
   const isClosingRef = (0, _react.useRef)(false);
 
@@ -320,9 +332,22 @@ function DialMenu({
   const cssAnimations = (0, _floatingToolsReact.getDialCSSAnimationStyles)();
 
   // Layout
+  const [viewport, setViewport] = (0, _react.useState)(() => ({
+    width: window.innerWidth,
+    height: window.innerHeight
+  }));
+  (0, _react.useEffect)(() => {
+    const resize = () => setViewport({
+      width: window.innerWidth,
+      height: window.innerHeight
+    });
+    window.addEventListener('resize', resize);
+    return () => window.removeEventListener('resize', resize);
+  }, []);
   const layout = (0, _react.useMemo)(() => (0, _floatingToolsReact.getDialLayout)({
-    screenWidth: window.innerWidth
-  }), []);
+    screenWidth: viewport.width,
+    maxCircleSize: Math.max(120, Math.min(320, viewport.height - 96))
+  }), [viewport]);
   const gridRotations = (0, _react.useMemo)(() => (0, _floatingToolsReact.getGridLineRotations)(), []);
   const positions = (0, _react.useMemo)(() => (0, _floatingToolsReact.getAllIconPositions)(_floatingToolsReact.MAX_DIAL_SLOTS, layout.iconRadius), [layout.iconRadius]);
 
@@ -469,17 +494,44 @@ function DialMenu({
     };
     animationRef.current = requestAnimationFrame(animate);
   }, [exit, onClose]);
-
-  // Document-level Escape key handler
   (0, _react.useEffect)(() => {
-    const handleKeyDown = e => {
-      if (e.key === 'Escape') {
+    const opener = document.activeElement;
+    const dialog = dialogRef.current;
+    return () => {
+      if (opener?.isConnected && (document.activeElement === document.body || dialog?.contains(document.activeElement))) {
+        opener.focus();
+      }
+    };
+  }, []);
+  (0, _react.useEffect)(() => {
+    if (settingsOpen) return;
+    centerRef.current?.focus();
+    const handleKeyDown = event => {
+      const dialog = dialogRef.current;
+      if (!dialog) return;
+      if (event.key === 'Escape') {
+        event.preventDefault();
         handleClose();
+      } else if (event.key === 'Tab') {
+        const controls = Array.from(dialog.querySelectorAll('button:not(:disabled):not([aria-disabled="true"]), [tabindex="0"]')).filter(element => element.getClientRects().length > 0);
+        const first = controls[0];
+        const last = controls[controls.length - 1];
+        if (!dialog.contains(document.activeElement) || (event.shiftKey ? document.activeElement === first : document.activeElement === last)) {
+          event.preventDefault();
+          (event.shiftKey ? last : first)?.focus();
+        }
+      } else if (['ArrowRight', 'ArrowDown', 'ArrowLeft', 'ArrowUp', 'Home', 'End'].includes(event.key)) {
+        const items = Array.from(dialog.querySelectorAll('[role="menuitem"]:not([aria-disabled="true"])'));
+        const current = items.indexOf(document.activeElement);
+        if (current < 0 || !items.length) return;
+        event.preventDefault();
+        const next = event.key === 'Home' ? 0 : event.key === 'End' ? items.length - 1 : (current + (event.key === 'ArrowRight' || event.key === 'ArrowDown' ? 1 : -1) + items.length) % items.length;
+        items[next].focus();
       }
     };
     document.addEventListener('keydown', handleKeyDown);
     return () => document.removeEventListener('keydown', handleKeyDown);
-  }, [handleClose]);
+  }, [handleClose, settingsOpen]);
 
   // Settings onboarding tooltip — native DialDevTools.tsx:174-196: shown
   // 1200ms after the dial mounts (entrance animations settle first) if never
@@ -555,6 +607,7 @@ function DialMenu({
   const hubClearance = layout.buttonSize * _floatingToolsReact.dialStyles.centerButton.containerRatio / 2 + 6;
   const isAnimating = entranceComplete && !isExiting;
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    ref: dialogRef,
     role: "dialog",
     "aria-label": "Dial Menu",
     "aria-modal": "true",
@@ -563,15 +616,16 @@ function DialMenu({
       inset: 0,
       zIndex: 10000
     },
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-      role: "button",
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
+      type: "button",
       "aria-label": "Close dial menu",
       tabIndex: 0,
       onClick: handleClose,
-      onKeyDown: e => e.key === 'Escape' && handleClose(),
       style: {
         position: 'absolute',
         inset: 0,
+        border: 0,
+        padding: 0,
         backgroundColor: _floatingToolsReact.dialColors.dialBackdrop,
         opacity: backdropOpacity
       }
@@ -641,7 +695,20 @@ function DialMenu({
             backgroundColor: _floatingToolsReact.dialColors.dialGridLine
           }
         }, side))
-      }, deg)), paddedIcons.map((icon, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(DialIconItem, {
+      }, deg)), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        "data-testid": "dial-background",
+        "data-background": backgroundId,
+        style: {
+          position: 'absolute',
+          inset: 0,
+          pointerEvents: 'none'
+        },
+        children: backgroundId === 'hyperspace' ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_DialHyperspace.DialHyperspace, {
+          size: layout.circleSize
+        }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.ToolBackground, {
+          focus: DIAL_BACKGROUND_FOCUS
+        })
+      }), paddedIcons.map((icon, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(DialIconItem, {
         icon: icon,
         index: index,
         totalIcons: paddedIcons.length,
@@ -707,11 +774,18 @@ function DialMenu({
             alignItems: 'center',
             justifyContent: 'center'
           },
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
+            ref: centerRef,
+            type: "button",
+            "aria-label": settingsOpen ? 'Close settings' : 'Open settings',
+            disabled: !onCenterPress,
             onClick: onCenterPress,
             onMouseEnter: () => setIsHoveringCenter(true),
             onMouseLeave: () => setIsHoveringCenter(false),
             style: {
+              border: 0,
+              padding: 0,
+              background: 'transparent',
               width: layout.buttonSize,
               height: layout.buttonSize,
               borderRadius: layout.buttonSize / 2,

package/lib/commonjs/floatingMenu/dial/DialIcon.js

@@ -25,11 +25,13 @@ var _jsxRuntime = require("react/jsx-runtime");
   "time-machine": "Time Machine",
   "highlight-updates": "Highlight Updates",
   "debug-borders": "Debug Borders",
-  "perf-monitor": "Perf Monitor",
+  // Bench (@buoy-gg/perf-monitor) has two dial entries: the HUD toggle and
+  // the tool. Both used to read "Perf Monitor", a name the product no longer uses.
+  "perf-monitor": "Bench HUD",
   "js-top": "JS Top",
   "js-top-modal": "JS Top",
   impersonate: "Impersonate",
-  "perf-monitor-modal": "Perf Monitor"
+  "perf-monitor-modal": "Bench"
 };
 function dialAccessibilityLabel(id, name) {
   if (id && DIAL_A11Y[id]) return DIAL_A11Y[id];

package/lib/commonjs/floatingMenu/settingsBus.js

@@ -3,21 +3,10 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.settingsBus = void 0;
-class SimpleEventBus {
-  listeners = new Set();
-  emit(payload) {
-    this.listeners.forEach(l => {
-      try {
-        l(payload);
-      } catch (e) {
-        console.error("Error emitting event:", e);
-      }
-    });
+Object.defineProperty(exports, "settingsBus", {
+  enumerable: true,
+  get: function () {
+    return _floatingToolsCore.settingsEventBus;
   }
-  addListener(listener) {
-    this.listeners.add(listener);
-    return () => this.listeners.delete(listener);
-  }
-}
-const settingsBus = exports.settingsBus = new SimpleEventBus();
+});
+var _floatingToolsCore = require("@buoy-gg/floating-tools-core");

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

@@ -0,0 +1,14 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useDesktopSyncStatus = useDesktopSyncStatus;
+var _react = require("react");
+var _sharedUi = require("@buoy-gg/shared-ui");
+const noopSubscribe = () => () => {};
+const serverSnapshot = () => null;
+function useDesktopSyncStatus() {
+  const sync = (0, _sharedUi.getRegisteredToolModule)("@buoy-gg/external-sync");
+  return (0, _react.useSyncExternalStore)(sync?.subscribeSyncStatus ?? noopSubscribe, () => sync?.getSyncStatus?.() ?? null, serverSnapshot);
+}

package/lib/commonjs/index.web.js

@@ -3,6 +3,38 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+var _exportNames = {
+  FloatingDevTools: true,
+  createWebTool: true,
+  FloatingTools: true,
+  UserStatus: true,
+  Divider: true,
+  DialMenu: true,
+  SettingsModal: true,
+  AppHostProvider: true,
+  AppOverlay: true,
+  useAppHost: true,
+  autoDiscoverWebPresets: true,
+  autoDiscoverWithCustom: true,
+  getToolsBySlot: true,
+  getEnabledTools: true,
+  defaultToolPresets: true,
+  useSettings: true,
+  useFloatingTools: true,
+  getToolLabel: true,
+  getToolDescription: true,
+  getToolColor: true,
+  settingsColors: true,
+  settingsStyles: true,
+  dialColors: true,
+  dialStyles: true,
+  createWebTools: true,
+  useToolHost: true,
+  useToolHeader: true,
+  DevToolsVisibilityProvider: true,
+  useDevToolsVisibility: true,
+  appSyncAdapter: true
+};
 Object.defineProperty(exports, "AppHostProvider", {
   enumerable: true,
   get: function () {
@@ -15,6 +47,12 @@ Object.defineProperty(exports, "AppOverlay", {
     return _AppHostWeb.AppOverlay;
   }
 });
+Object.defineProperty(exports, "DevToolsVisibilityProvider", {
+  enumerable: true,
+  get: function () {
+    return _DevToolsVisibilityContext.DevToolsVisibilityProvider;
+  }
+});
 Object.defineProperty(exports, "DialMenu", {
   enumerable: true,
   get: function () {
@@ -51,6 +89,12 @@ Object.defineProperty(exports, "UserStatus", {
     return _floatingToolsWeb.UserStatus;
   }
 });
+Object.defineProperty(exports, "appSyncAdapter", {
+  enumerable: true,
+  get: function () {
+    return _appSyncAdapter.appSyncAdapter;
+  }
+});
 Object.defineProperty(exports, "autoDiscoverWebPresets", {
   enumerable: true,
   get: function () {
@@ -63,6 +107,18 @@ Object.defineProperty(exports, "autoDiscoverWithCustom", {
     return _autoDiscoverPresetsWeb.autoDiscoverWithCustom;
   }
 });
+Object.defineProperty(exports, "createWebTool", {
+  enumerable: true,
+  get: function () {
+    return _createWebTool.createWebTool;
+  }
+});
+Object.defineProperty(exports, "createWebTools", {
+  enumerable: true,
+  get: function () {
+    return _createWebTools.createWebTools;
+  }
+});
 Object.defineProperty(exports, "defaultToolPresets", {
   enumerable: true,
   get: function () {
@@ -129,6 +185,12 @@ Object.defineProperty(exports, "useAppHost", {
     return _AppHostWeb.useAppHost;
   }
 });
+Object.defineProperty(exports, "useDevToolsVisibility", {
+  enumerable: true,
+  get: function () {
+    return _DevToolsVisibilityContext.useDevToolsVisibility;
+  }
+});
 Object.defineProperty(exports, "useFloatingTools", {
   enumerable: true,
   get: function () {
@@ -141,10 +203,39 @@ Object.defineProperty(exports, "useSettings", {
     return _floatingToolsReact.useSettings;
   }
 });
+Object.defineProperty(exports, "useToolHeader", {
+  enumerable: true,
+  get: function () {
+    return _ToolHost.useToolHeader;
+  }
+});
+Object.defineProperty(exports, "useToolHost", {
+  enumerable: true,
+  get: function () {
+    return _ToolHost.useToolHost;
+  }
+});
 var _FloatingDevToolsWeb = require("./floatingMenu/FloatingDevTools.web.js");
+var _createWebTool = require("./utils/createWebTool.js");
 var _floatingToolsWeb = require("./floatingMenu/floatingTools.web.js");
 var _DialDevToolsWeb = require("./floatingMenu/dial/DialDevTools.web.js");
 var _DevToolsSettingsModalWeb = require("./floatingMenu/DevToolsSettingsModal.web.js");
 var _AppHostWeb = require("./floatingMenu/AppHost.web.js");
 var _autoDiscoverPresetsWeb = require("./utils/autoDiscoverPresets.web.js");
-var _floatingToolsReact = require("@buoy-gg/floating-tools-react");
+var _floatingToolsReact = require("@buoy-gg/floating-tools-react");
+var _createWebTools = require("./utils/createWebTools.js");
+var _toolkit = require("./toolkit.js");
+Object.keys(_toolkit).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _toolkit[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _toolkit[key];
+    }
+  });
+});
+var _ToolHost = require("./floatingMenu/ToolHost.js");
+var _DevToolsVisibilityContext = require("./floatingMenu/DevToolsVisibilityContext.js");
+var _appSyncAdapter = require("./floatingMenu/sync/appSyncAdapter.js");

package/lib/commonjs/reactDevtoolsTypes.js

@@ -0,0 +1 @@
+"use strict";