@buoy-gg/core 3.0.1 → 3.0.2

package/lib/module/floatingMenu/FloatingMenu.js

@@ -1,7 +1,8 @@
 "use strict";
 
 import React, { useEffect, useMemo, useRef, useState } from "react";
-import { TouchableOpacity, StyleSheet, View, Dimensions } from "react-native";
+import { TouchableOpacity, StyleSheet, View } from "react-native";
+import { absoluteFill } from "@buoy-gg/shared-ui";
 import { FloatingTools, UserStatus } from "./floatingTools";
 import { DialDevTools } from "./dial/DialDevTools";
 import { EnvironmentIndicator, persistentStorage, useHintsDisabled, devToolsStorageKeys, buoyColors } from "@buoy-gg/shared-ui";
@@ -22,10 +23,6 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
  */
 const FLOATING_MENU_ONBOARDING_KEY = "@react_buoy_floating_menu_tooltip_shown";
 const ONBOARDING_STEP_KEY = "@react_buoy_onboarding_step";
-const {
-  width: SCREEN_WIDTH,
-  height: SCREEN_HEIGHT
-} = Dimensions.get("window");
 export const FloatingMenu = ({
   apps,
   state,
@@ -322,11 +319,11 @@ const styles = StyleSheet.create({
     fontWeight: "900"
   },
   onboardingContainer: {
-    ...StyleSheet.absoluteFillObject,
+    ...absoluteFill,
     zIndex: 10000
   },
   onboardingBackdrop: {
-    ...StyleSheet.absoluteFillObject,
+    ...absoluteFill,
     backgroundColor: "rgba(0, 0, 0, 0.85)"
   }
 });

package/lib/module/floatingMenu/autoExternalSync.js

@@ -0,0 +1,209 @@
+"use strict";
+
+/**
+ * Zero-config device→desktop sync for FloatingDevTools.
+ *
+ * When @buoy-gg/external-sync is installed, FloatingDevTools renders
+ * <AutoExternalSync /> in dev builds: it connects to the Buoy Desktop broker
+ * (localhost:42831 — a silent no-op when the desktop app isn't running) and
+ * registers a sync adapter for every installed tool package, discovered with
+ * the same guarded-require pattern as autoDiscoverPresets. No <DevToolsSync>
+ * wiring needed in the app.
+ *
+ * Identity defaults come from expo-constants when available (app name →
+ * "MyApp (ios)" / "myapp-ios"), overridable via the `externalSync` prop.
+ */
+import { useMemo } from "react";
+import { Platform } from "react-native";
+/* eslint-disable @typescript-eslint/no-var-requires */
+
+// Module-level guarded requires: presence is constant for the app lifetime,
+// so hooks pulled from these modules keep a stable call order.
+//
+// IMPORTANT: each require() must sit LEXICALLY inside its own try block
+// (same pattern as autoDiscoverPresets) — Metro only marks a dependency as
+// optional when the require is directly inside a try statement. Wrapping it
+// in a helper/arrow makes Metro hard-fail the bundle for apps that don't
+// install that package.
+let externalSyncModule = null;
+let storageModule = null;
+let networkModule = null;
+let reactQueryModule = null;
+let routeEventsModule = null;
+let reduxModule = null;
+let zustandModule = null;
+let jotaiModule = null;
+let eventsModule = null;
+let envModule = null;
+let highlightUpdatesModule = null;
+let debugBordersModule = null;
+let impersonateModule = null;
+let perfMonitorModule = null;
+let expoConstantsModule = null;
+try {
+  externalSyncModule = require("@buoy-gg/external-sync");
+} catch {
+  // not installed
+}
+try {
+  storageModule = require("@buoy-gg/storage");
+} catch {
+  // not installed
+}
+try {
+  networkModule = require("@buoy-gg/network");
+} catch {
+  // not installed
+}
+try {
+  reactQueryModule = require("@buoy-gg/react-query");
+} catch {
+  // not installed
+}
+try {
+  routeEventsModule = require("@buoy-gg/route-events");
+} catch {
+  // not installed
+}
+try {
+  reduxModule = require("@buoy-gg/redux");
+} catch {
+  // not installed
+}
+try {
+  zustandModule = require("@buoy-gg/zustand");
+} catch {
+  // not installed
+}
+try {
+  jotaiModule = require("@buoy-gg/jotai");
+} catch {
+  // not installed
+}
+try {
+  eventsModule = require("@buoy-gg/events");
+} catch {
+  // not installed
+}
+try {
+  envModule = require("@buoy-gg/env");
+} catch {
+  // not installed
+}
+try {
+  highlightUpdatesModule = require("@buoy-gg/highlight-updates");
+} catch {
+  // not installed
+}
+try {
+  debugBordersModule = require("@buoy-gg/debug-borders");
+} catch {
+  // not installed
+}
+try {
+  impersonateModule = require("@buoy-gg/impersonate");
+} catch {
+  // not installed
+}
+try {
+  perfMonitorModule = require("@buoy-gg/perf-monitor");
+} catch {
+  // not installed
+}
+try {
+  expoConstantsModule = require("expo-constants");
+} catch {
+  // not installed (RN CLI apps)
+}
+
+/** Whether zero-config sync can run (the external-sync package is installed). */
+export function isExternalSyncAvailable() {
+  return !!externalSyncModule?.useExternalSyncSocket;
+}
+function getAppName() {
+  const constants = expoConstantsModule?.default ?? expoConstantsModule;
+  return constants?.expoConfig?.name ?? constants?.manifest2?.extra?.expoClient?.name ?? null;
+}
+function defaultIdentity() {
+  const appName = getAppName();
+  const slug = (appName ?? "buoy").toLowerCase().replace(/[^a-z0-9]+/g, "-").replace(/(^-|-$)/g, "");
+  return {
+    deviceName: `${appName ?? "Buoy Device"} (${Platform.OS})`,
+    deviceId: `${slug || "buoy"}-${Platform.OS}`
+  };
+}
+export function AutoExternalSync({
+  options,
+  requiredEnvVars
+}) {
+  const {
+    useExternalSyncSocket,
+    useExternalSync
+  } = externalSyncModule;
+
+  // Context-based query adapter; null when there is no QueryClientProvider
+  // above FloatingDevTools (or the installed @buoy-gg/react-query predates
+  // the hook).
+  const queryAdapter = reactQueryModule?.useReactQuerySyncAdapter ? reactQueryModule.useReactQuerySyncAdapter() : null;
+  const identity = useMemo(defaultIdentity, []);
+  const deviceId = options?.deviceId ?? identity.deviceId;
+  const {
+    socket
+  } = useExternalSyncSocket({
+    deviceName: options?.deviceName ?? identity.deviceName,
+    socketURL: options?.socketURL ?? "http://localhost:42831",
+    persistentDeviceId: deviceId,
+    platform: Platform.OS,
+    enableLogs: options?.enableLogs
+  });
+  const tools = useMemo(() => {
+    const map = {};
+    if (storageModule?.storageSyncAdapter) {
+      map.storage = storageModule.storageSyncAdapter;
+    }
+    if (networkModule?.networkSyncAdapter) {
+      map.network = networkModule.networkSyncAdapter;
+    }
+    if (queryAdapter) {
+      map.query = queryAdapter;
+    }
+    if (routeEventsModule?.routeEventsSyncAdapter) {
+      map["route-events"] = routeEventsModule.routeEventsSyncAdapter;
+    }
+    if (reduxModule?.reduxSyncAdapter) {
+      map.redux = reduxModule.reduxSyncAdapter;
+    }
+    if (zustandModule?.zustandSyncAdapter) {
+      map.zustand = zustandModule.zustandSyncAdapter;
+    }
+    if (jotaiModule?.jotaiSyncAdapter) {
+      map.jotai = jotaiModule.jotaiSyncAdapter;
+    }
+    if (eventsModule?.eventsSyncAdapter) {
+      map.events = eventsModule.eventsSyncAdapter;
+    }
+    if (envModule?.createEnvSyncAdapter) {
+      map.env = envModule.createEnvSyncAdapter(requiredEnvVars ?? []);
+    }
+    if (highlightUpdatesModule?.highlightUpdatesSyncAdapter) {
+      map["highlight-updates"] = highlightUpdatesModule.highlightUpdatesSyncAdapter;
+    }
+    if (debugBordersModule?.debugBordersSyncAdapter) {
+      map["debug-borders"] = debugBordersModule.debugBordersSyncAdapter;
+    }
+    if (impersonateModule?.impersonateSyncAdapter) {
+      map.impersonate = impersonateModule.impersonateSyncAdapter;
+    }
+    if (perfMonitorModule?.perfMonitorSyncAdapter) {
+      map["perf-monitor"] = perfMonitorModule.perfMonitorSyncAdapter;
+    }
+    return map;
+  }, [queryAdapter, requiredEnvVars]);
+  useExternalSync({
+    tools,
+    socket,
+    deviceId,
+    enableLogs: options?.enableLogs
+  });
+  return null;
+}

package/lib/module/floatingMenu/defaultConfig.js

@@ -23,7 +23,7 @@
  * This is a union type of all auto-discovered tool IDs.
  */
 
-// Render count analysis modal (@buoy-gg/highlight-updates)
+// Benchmark recording modal (@buoy-gg/perf-monitor)
 
 /**
  * Special floating-only tool IDs that only appear in the floating bubble row.

package/lib/module/floatingMenu/dial/DialDevTools.js

@@ -1,7 +1,8 @@
 "use strict";
 
 import { useEffect, useMemo, useRef, useState } from "react";
-import { Pressable, StyleSheet, View, Dimensions, Text, Animated, Easing } from "react-native";
+import { Pressable, StyleSheet, View, useWindowDimensions, Text, Animated, Easing } from "react-native";
+import { absoluteFill } from "@buoy-gg/shared-ui";
 // Icons are provided by installedApps; no direct icon imports here.
 import { DialIcon } from "./DialIcon.js";
 import { DialPagination } from "./DialPagination.js";
@@ -11,19 +12,13 @@ import { DevToolsSettingsModal, useDevToolsSettings } from "../DevToolsSettingsM
 import { useIsPro } from "@buoy-gg/license";
 import { useAppHost } from "../AppHost.js";
 import { OnboardingTooltip } from "./OnboardingTooltip.js";
-import { getDialLayout, MAX_DIAL_SLOTS, dialAnimationConfig, dialColors } from "@buoy-gg/floating-tools-core";
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-const {
-  width: SCREEN_WIDTH,
-  height: SCREEN_HEIGHT
-} = Dimensions.get("window");
+import { getDialLayout, MAX_DIAL_SLOTS, DIAL_BUTTON_SIZE, dialAnimationConfig, dialColors } from "@buoy-gg/floating-tools-core";
 
-// Use shared layout calculation from core
-const layout = getDialLayout({
-  screenWidth: SCREEN_WIDTH
-});
-const CIRCLE_SIZE = layout.circleSize;
-const BUTTON_SIZE = layout.buttonSize;
+// The circle size depends on the live window width, so it's computed inside
+// the component via useWindowDimensions — a module-scope Dimensions.get
+// snapshot goes stale when the window resizes after load (web/desktop).
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+const BUTTON_SIZE = DIAL_BUTTON_SIZE;
 const ONBOARDING_STORAGE_KEY = "@react_buoy_settings_tooltip_shown";
 /** A non-interactive placeholder used to fill out the last dial page. */
 const createEmptySlot = slotIndex => ({
@@ -55,6 +50,33 @@ export const DialDevTools = ({
   } = useAppHost();
   const isPro = useIsPro();
 
+  // Live window size — keeps the dial centered and sized correctly when the
+  // window resizes (Electron/web) or the device rotates.
+  const {
+    width: screenWidth,
+    height: screenHeight
+  } = useWindowDimensions();
+  const circleSize = getDialLayout({
+    screenWidth
+  }).circleSize;
+  const sizeStyles = useMemo(() => ({
+    parent: {
+      width: circleSize,
+      height: circleSize
+    },
+    circle: {
+      width: circleSize,
+      height: circleSize,
+      borderRadius: circleSize / 2
+    },
+    rounded: {
+      borderRadius: circleSize / 2
+    },
+    gridLine: {
+      width: circleSize
+    }
+  }), [circleSize]);
+
   // Load persisted settings modal state on mount
   useEffect(() => {
     const loadSettingsModalState = async () => {
@@ -480,13 +502,13 @@ export const DialDevTools = ({
     children: [/*#__PURE__*/_jsx(Animated.View, {
       style: [styles.backdrop, backdropAnimatedStyle],
       children: /*#__PURE__*/_jsx(Pressable, {
-        style: StyleSheet.absoluteFillObject,
+        style: absoluteFill,
         onPress: handleClose
       })
     }), /*#__PURE__*/_jsxs(Animated.View, {
-      style: [styles.parent, {
+      style: [styles.parent, sizeStyles.parent, {
         position: "absolute",
-        left: (SCREEN_WIDTH - CIRCLE_SIZE) / 2,
+        left: (screenWidth - circleSize) / 2,
         bottom: 80,
         transform: [{
           scale: dialScale
@@ -498,21 +520,21 @@ export const DialDevTools = ({
         }]
       }],
       children: [/*#__PURE__*/_jsxs(Animated.View, {
-        style: styles.circle,
+        style: [styles.circle, sizeStyles.circle],
         children: [/*#__PURE__*/_jsxs(View, {
-          style: styles.gradientBackground,
+          style: [styles.gradientBackground, sizeStyles.rounded],
           children: [/*#__PURE__*/_jsx(View, {
-            style: styles.gradientLayer1
+            style: [styles.gradientLayer1, sizeStyles.rounded]
           }), /*#__PURE__*/_jsx(View, {
-            style: styles.gradientLayer2
+            style: [styles.gradientLayer2, sizeStyles.rounded]
           }), /*#__PURE__*/_jsx(View, {
-            style: styles.gradientLayer3
+            style: [styles.gradientLayer3, sizeStyles.rounded]
           }), /*#__PURE__*/_jsx(View, {
             style: styles.gridPattern,
             children: Array.from({
               length: 6
             }).map((_, i) => /*#__PURE__*/_jsx(View, {
-              style: [styles.gridLine, {
+              style: [styles.gridLine, sizeStyles.gridLine, {
                 transform: [{
                   rotate: `${i * 60}deg`
                 }]
@@ -603,11 +625,11 @@ export const DialDevTools = ({
       onNext: () => handlePageChange(safePage + 1),
       animatedStyle: {
         position: "absolute",
-        left: (SCREEN_WIDTH - CIRCLE_SIZE) / 2,
-        // Circle's bottom edge sits at bottom: 80 -> SCREEN_HEIGHT - 80
+        left: (screenWidth - circleSize) / 2,
+        // Circle's bottom edge sits at bottom: 80 -> screenHeight - 80
         // from the top. Place the pager 16px below that edge.
-        top: SCREEN_HEIGHT - 80 + 16,
-        width: CIRCLE_SIZE,
+        top: screenHeight - 80 + 16,
+        width: circleSize,
         opacity: dialScale,
         transform: [{
           scale: dialScale
@@ -628,23 +650,20 @@ export const DialDevTools = ({
 };
 const styles = StyleSheet.create({
   container: {
-    ...StyleSheet.absoluteFillObject,
+    ...absoluteFill,
     zIndex: 9999
   },
   backdrop: {
-    ...StyleSheet.absoluteFillObject,
+    ...absoluteFill,
     backgroundColor: dialColors.dialBackdrop
   },
+  // width/height/borderRadius for the circle pieces come from sizeStyles —
+  // they track the live window width.
   parent: {
-    width: CIRCLE_SIZE,
-    height: CIRCLE_SIZE,
     alignItems: "center",
     justifyContent: "center"
   },
   circle: {
-    width: CIRCLE_SIZE,
-    height: CIRCLE_SIZE,
-    borderRadius: CIRCLE_SIZE / 2,
     position: "absolute",
     backgroundColor: "transparent",
     borderWidth: 1,
@@ -661,41 +680,36 @@ const styles = StyleSheet.create({
   gradientBackground: {
     width: "100%",
     height: "100%",
-    borderRadius: CIRCLE_SIZE / 2,
     position: "relative",
     backgroundColor: dialColors.dialBackground,
     overflow: "hidden"
   },
   gradientLayer1: {
-    ...StyleSheet.absoluteFillObject,
+    ...absoluteFill,
     backgroundColor: dialColors.dialGradient1,
-    opacity: 0.6,
-    borderRadius: CIRCLE_SIZE / 2
+    opacity: 0.6
   },
   gradientLayer2: {
-    ...StyleSheet.absoluteFillObject,
+    ...absoluteFill,
     backgroundColor: dialColors.dialGradient2,
     opacity: 0.4,
     top: "30%",
-    left: "30%",
-    borderRadius: CIRCLE_SIZE / 2
+    left: "30%"
   },
   gradientLayer3: {
-    ...StyleSheet.absoluteFillObject,
+    ...absoluteFill,
     backgroundColor: dialColors.dialGradient3,
     opacity: 0.3,
     top: "50%",
-    left: "50%",
-    borderRadius: CIRCLE_SIZE / 2
+    left: "50%"
   },
   gridPattern: {
-    ...StyleSheet.absoluteFillObject,
+    ...absoluteFill,
     alignItems: "center",
     justifyContent: "center"
   },
   gridLine: {
     position: "absolute",
-    width: CIRCLE_SIZE,
     height: 1,
     backgroundColor: dialColors.dialGridLine
   },
@@ -721,13 +735,13 @@ const styles = StyleSheet.create({
     overflow: "hidden"
   },
   buttonGradientLayer1: {
-    ...StyleSheet.absoluteFillObject,
+    ...absoluteFill,
     backgroundColor: dialColors.dialGradient1,
     opacity: 0.5,
     borderRadius: BUTTON_SIZE
   },
   buttonGradientLayer2: {
-    ...StyleSheet.absoluteFillObject,
+    ...absoluteFill,
     backgroundColor: dialColors.dialGradient2,
     opacity: 0.3,
     top: "20%",
@@ -735,7 +749,7 @@ const styles = StyleSheet.create({
     borderRadius: BUTTON_SIZE
   },
   buttonGradientLayer3: {
-    ...StyleSheet.absoluteFillObject,
+    ...absoluteFill,
     backgroundColor: dialColors.dialGradient3,
     opacity: 0.2,
     top: "40%",

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

@@ -1,19 +1,13 @@
 "use strict";
 
 import { useMemo, useRef } from "react";
-import { StyleSheet, Pressable, View, Text, Dimensions, Animated } from "react-native";
-import { getDialLayout, getIconPosition, getIconStaggerInputRange, DIAL_START_ANGLE, dialColors, dialStyles, dialAnimationConfig } from "@buoy-gg/floating-tools-core";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-const {
-  width: SCREEN_WIDTH
-} = Dimensions.get("window");
+import { StyleSheet, Pressable, View, Text, useWindowDimensions, Animated } from "react-native";
+import { getDialLayout, getIconPosition, getIconStaggerInputRange, DIAL_START_ANGLE, DIAL_ICON_SIZE, dialColors, dialStyles, dialAnimationConfig } from "@buoy-gg/floating-tools-core";
 
-// Use shared layout calculation
-const layout = getDialLayout({
-  screenWidth: SCREEN_WIDTH
-});
-const VIEW_SIZE = layout.iconSize;
-const CIRCLE_RADIUS = layout.circleRadius;
+// The circle radius depends on the live window width and is computed inside
+// the component (must match DialDevTools' circle, which does the same).
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const VIEW_SIZE = DIAL_ICON_SIZE;
 export const DialIcon = ({
   index,
   icon,
@@ -24,6 +18,12 @@ export const DialIcon = ({
 }) => {
   // Animation values - using interpolation for better performance
   const scale = useRef(new Animated.Value(1)).current;
+  const {
+    width: screenWidth
+  } = useWindowDimensions();
+  const layout = useMemo(() => getDialLayout({
+    screenWidth
+  }), [screenWidth]);
 
   // Hover animation on press in/out - using shared config
   // Fallback values in case dialAnimationConfig hasn't loaded yet
@@ -119,14 +119,14 @@ export const DialIcon = ({
       itemOpacity,
       progressScale: staggeredProgress
     };
-  }, [index, totalIcons, iconsProgress]);
+  }, [index, totalIcons, iconsProgress, layout]);
 
   // Main animated style for position and appearance
   const animatedStyle = {
     position: "absolute",
-    left: CIRCLE_RADIUS - VIEW_SIZE / 2,
+    left: layout.circleRadius - VIEW_SIZE / 2,
     // Center position
-    top: CIRCLE_RADIUS - VIEW_SIZE / 2,
+    top: layout.circleRadius - VIEW_SIZE / 2,
     // Center position
     opacity: motion.itemOpacity,
     transform: [{

package/lib/module/floatingMenu/dial/OnboardingTooltip.js

@@ -2,6 +2,7 @@
 
 import { useEffect, useRef } from "react";
 import { Animated, Pressable, StyleSheet, Text, View, Easing } from "react-native";
+import { absoluteFill } from "@buoy-gg/shared-ui";
 import { dialColors, buoyColors } from "@buoy-gg/shared-ui";
 import { calculateTooltipPosition, ARROW_BOTTOM_OFFSET, ARROW_HEIGHT } from "./onboardingConstants.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
@@ -128,7 +129,7 @@ export const OnboardingTooltip = ({
 };
 const styles = StyleSheet.create({
   container: {
-    ...StyleSheet.absoluteFillObject,
+    ...absoluteFill,
     alignItems: "center",
     justifyContent: "center",
     pointerEvents: "box-none"

package/lib/typescript/commonjs/floatingMenu/DevToolsSettingsModal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DevToolsSettingsModal.d.ts","sourceRoot":"","sources":["../../../../src/floatingMenu/DevToolsSettingsModal.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA6C,EAAE,EAAE,MAAM,OAAO,CAAC;AAqJtE;;;GAGG;AACH,MAAM,WAAW,sBAAsB;IACrC;;;;OAIG;IACH,2BAA2B,CAAC,EAAE,OAAO,CAAC;IACtC;;;OAGG;IACH,wBAAwB,CAAC,EAAE,OAAO,CAAC;CACpC;AAED;;;GAGG;AACH,MAAM,WAAW,gBAAgB;IAC/B,4EAA4E;IAC5E,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACnC,uFAAuF;IACvF,aAAa,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG;QACvC,WAAW,EAAE,OAAO,CAAC;KACtB,CAAC;IACF,kDAAkD;IAClD,cAAc,CAAC,EAAE,sBAAsB,CAAC;CACzC;AAED,UAAU,0BAA0B;IAClC,OAAO,EAAE,OAAO,CAAC;IACjB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,gBAAgB,CAAC,EAAE,CAAC,QAAQ,EAAE,gBAAgB,KAAK,IAAI,CAAC;IACxD,eAAe,CAAC,EAAE,gBAAgB,CAAC;IACnC,aAAa,CAAC,EAAE;QACd,EAAE,EAAE,MAAM,CAAC;QACX,IAAI,EAAE,MAAM,CAAC;QACb,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,IAAI,CAAC,EAAE,MAAM,GAAG,KAAK,GAAG,MAAM,CAAC;KAChC,EAAE,CAAC;CACL;AA2DD;;;GAGG;AACH,eAAO,MAAM,qBAAqB,EAAE,EAAE,CAAC,0BAA0B,CA28BhE,CAAC;AAwDF;;;;;;GAMG;AACH,eAAO,MAAM,mBAAmB;;;CAuD/B,CAAC"}
+{"version":3,"file":"DevToolsSettingsModal.d.ts","sourceRoot":"","sources":["../../../../src/floatingMenu/DevToolsSettingsModal.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA6C,EAAE,EAAE,MAAM,OAAO,CAAC;AAsJtE;;;GAGG;AACH,MAAM,WAAW,sBAAsB;IACrC;;;;OAIG;IACH,2BAA2B,CAAC,EAAE,OAAO,CAAC;IACtC;;;OAGG;IACH,wBAAwB,CAAC,EAAE,OAAO,CAAC;CACpC;AAED;;;GAGG;AACH,MAAM,WAAW,gBAAgB;IAC/B,4EAA4E;IAC5E,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACnC,uFAAuF;IACvF,aAAa,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG;QACvC,WAAW,EAAE,OAAO,CAAC;KACtB,CAAC;IACF,kDAAkD;IAClD,cAAc,CAAC,EAAE,sBAAsB,CAAC;CACzC;AAED,UAAU,0BAA0B;IAClC,OAAO,EAAE,OAAO,CAAC;IACjB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,gBAAgB,CAAC,EAAE,CAAC,QAAQ,EAAE,gBAAgB,KAAK,IAAI,CAAC;IACxD,eAAe,CAAC,EAAE,gBAAgB,CAAC;IACnC,aAAa,CAAC,EAAE;QACd,EAAE,EAAE,MAAM,CAAC;QACX,IAAI,EAAE,MAAM,CAAC;QACb,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,IAAI,CAAC,EAAE,MAAM,GAAG,KAAK,GAAG,MAAM,CAAC;KAChC,EAAE,CAAC;CACL;AA2DD;;;GAGG;AACH,eAAO,MAAM,qBAAqB,EAAE,EAAE,CAAC,0BAA0B,CA+8BhE,CAAC;AAwDF;;;;;;GAMG;AACH,eAAO,MAAM,mBAAmB;;;CAuD/B,CAAC"}

package/lib/typescript/commonjs/floatingMenu/FloatingDevTools.d.ts

@@ -2,6 +2,7 @@ import React from "react";
 import { type FloatingMenuProps } from "./FloatingMenu";
 import type { InstalledApp } from "./types";
 import { type DefaultFloatingConfig, type DefaultDialConfig } from "./defaultConfig";
+import { type ExternalSyncOptions } from "./autoExternalSync";
 /**
  * Environment variable configuration
  *
@@ -229,6 +230,23 @@ export interface FloatingDevToolsProps extends Omit<FloatingMenuProps, "apps"> {
      * ```
      */
     zustandStores?: Record<string, any>;
+    /**
+     * Zero-config sync to the Buoy Desktop dashboard.
+     *
+     * Enabled by default in dev builds whenever @buoy-gg/external-sync is
+     * installed: connects to the desktop broker (localhost:42831 — a silent
+     * no-op when the desktop app isn't running) and registers a sync adapter
+     * for every installed tool automatically. Nothing else to render.
+     *
+     * Pass `false` to disable, or options to customize the device identity /
+     * broker URL:
+     *
+     * @example
+     * ```tsx
+     * <FloatingDevTools externalSync={{ deviceName: "My App (ios)" }} />
+     * ```
+     */
+    externalSync?: boolean | ExternalSyncOptions;
 }
 /**
  * Unified floating development tools component with automatic preset discovery.
@@ -284,5 +302,5 @@ export interface FloatingDevToolsProps extends Omit<FloatingMenuProps, "apps"> {
  *
  * @param props - FloatingDevTools props
  */
-export declare const FloatingDevTools: ({ apps, requiredEnvVars, requiredStorageKeys, children, disableHints, defaultFloatingTools, defaultDialTools, requireLicense, licenseKey: licenseKeyProp, zustandStores, environment, ...props }: FloatingDevToolsProps) => React.JSX.Element | null;
+export declare const FloatingDevTools: ({ apps, requiredEnvVars, requiredStorageKeys, children, disableHints, defaultFloatingTools, defaultDialTools, requireLicense, licenseKey: licenseKeyProp, zustandStores, environment, externalSync, ...props }: FloatingDevToolsProps) => React.JSX.Element | null;
 //# sourceMappingURL=FloatingDevTools.d.ts.map

package/lib/typescript/commonjs/floatingMenu/FloatingDevTools.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FloatingDevTools.d.ts","sourceRoot":"","sources":["../../../../src/floatingMenu/FloatingDevTools.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+D,MAAM,OAAO,CAAC;AAGpF,OAAO,EAAgB,KAAK,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAMtE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAI5C,OAAO,EACL,KAAK,qBAAqB,EAC1B,KAAK,iBAAiB,EAEvB,MAAM,iBAAiB,CAAC;AAIzB;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,MAAM,YAAY,GACpB,MAAM,GACN;IACE,GAAG,EAAE,MAAM,CAAC;IACZ,aAAa,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,GACD;IACE,GAAG,EAAE,MAAM,CAAC;IACZ,YAAY,EACR,QAAQ,GACR,QAAQ,GACR,SAAS,GACT,QAAQ,GACR,OAAO,GACP,KAAK,CAAC;IACV,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEN;;GAEG;AACH,MAAM,WAAW,gBAAgB;IAC/B,GAAG,EAAE,MAAM,CAAC;IACZ,YAAY,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,SAAS,GAAG,QAAQ,CAAC;IAC1D,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,EAAE,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;CAC1C;AAED;;;;;;GAMG;AACH,MAAM,WAAW,qBAAsB,SAAQ,IAAI,CAAC,iBAAiB,EAAE,MAAM,CAAC;IAC5E;;;;;;;;;;;;;;;;;;;;;;OAsBG;IACH,IAAI,CAAC,EAAE,YAAY,EAAE,CAAC;IAEtB;;;;;;;;;;;;;;OAcG;IACH,eAAe,CAAC,EAAE,YAAY,EAAE,CAAC;IAEjC;;;;;;;;;;;;OAYG;IACH,mBAAmB,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAEzC;;;;;;;;;;OAUG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE3B;;;;;;;;;OASG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB;;;;;;;;;;;;;OAaG;IACH,oBAAoB,CAAC,EAAE,qBAAqB,CAAC;IAE7C;;;;;;;;;;;;;;OAcG;IACH,gBAAgB,CAAC,EAAE,iBAAiB,CAAC;IAErC;;;;;;;;;;;;;;;;OAgBG;IACH,qBAAqB,CAAC,EAAE,OAAO,oBAAoB,EAAE,WAAW,EAAE,CAAC;IAEnE;;;;;;;;;;;;;OAaG;IACH,mBAAmB,CAAC,EAAE,CAAC,WAAW,EAAE,OAAO,oBAAoB,EAAE,WAAW,KAAK,IAAI,CAAC;IAEtF;;;;;;;;;;OAUG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB;;;;;;;;OAQG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB;;;;;;;;;;;;;;;;;;OAkBG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;CACrC;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqDG;AACH,eAAO,MAAM,gBAAgB,GAAI,kMAa9B,qBAAqB,6BAwOvB,CAAC"}
+{"version":3,"file":"FloatingDevTools.d.ts","sourceRoot":"","sources":["../../../../src/floatingMenu/FloatingDevTools.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+D,MAAM,OAAO,CAAC;AAGpF,OAAO,EAAgB,KAAK,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAMtE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAI5C,OAAO,EACL,KAAK,qBAAqB,EAC1B,KAAK,iBAAiB,EAEvB,MAAM,iBAAiB,CAAC;AAGzB,OAAO,EAGL,KAAK,mBAAmB,EACzB,MAAM,oBAAoB,CAAC;AAE5B;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,MAAM,YAAY,GACpB,MAAM,GACN;IACE,GAAG,EAAE,MAAM,CAAC;IACZ,aAAa,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,GACD;IACE,GAAG,EAAE,MAAM,CAAC;IACZ,YAAY,EACR,QAAQ,GACR,QAAQ,GACR,SAAS,GACT,QAAQ,GACR,OAAO,GACP,KAAK,CAAC;IACV,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEN;;GAEG;AACH,MAAM,WAAW,gBAAgB;IAC/B,GAAG,EAAE,MAAM,CAAC;IACZ,YAAY,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,SAAS,GAAG,QAAQ,CAAC;IAC1D,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,EAAE,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;CAC1C;AAED;;;;;;GAMG;AACH,MAAM,WAAW,qBAAsB,SAAQ,IAAI,CAAC,iBAAiB,EAAE,MAAM,CAAC;IAC5E;;;;;;;;;;;;;;;;;;;;;;OAsBG;IACH,IAAI,CAAC,EAAE,YAAY,EAAE,CAAC;IAEtB;;;;;;;;;;;;;;OAcG;IACH,eAAe,CAAC,EAAE,YAAY,EAAE,CAAC;IAEjC;;;;;;;;;;;;OAYG;IACH,mBAAmB,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAEzC;;;;;;;;;;OAUG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE3B;;;;;;;;;OASG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB;;;;;;;;;;;;;OAaG;IACH,oBAAoB,CAAC,EAAE,qBAAqB,CAAC;IAE7C;;;;;;;;;;;;;;OAcG;IACH,gBAAgB,CAAC,EAAE,iBAAiB,CAAC;IAErC;;;;;;;;;;;;;;;;OAgBG;IACH,qBAAqB,CAAC,EAAE,OAAO,oBAAoB,EAAE,WAAW,EAAE,CAAC;IAEnE;;;;;;;;;;;;;OAaG;IACH,mBAAmB,CAAC,EAAE,CAAC,WAAW,EAAE,OAAO,oBAAoB,EAAE,WAAW,KAAK,IAAI,CAAC;IAEtF;;;;;;;;;;OAUG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB;;;;;;;;OAQG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB;;;;;;;;;;;;;;;;;;OAkBG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAEpC;;;;;;;;;;;;;;;OAeG;IACH,YAAY,CAAC,EAAE,OAAO,GAAG,mBAAmB,CAAC;CAC9C;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqDG;AACH,eAAO,MAAM,gBAAgB,GAAI,gNAc9B,qBAAqB,6BAqPvB,CAAC"}

package/lib/typescript/commonjs/floatingMenu/FloatingMenu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FloatingMenu.d.ts","sourceRoot":"","sources":["../../../../src/floatingMenu/FloatingMenu.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,EAAE,EAAqD,MAAM,OAAO,CAAC;AASrF,OAAO,EAAiB,QAAQ,EAAc,MAAM,iBAAiB,CAAC;AACtE,OAAO,KAAK,EACV,YAAY,EACZ,mBAAmB,EACnB,iBAAiB,EAClB,MAAM,SAAS,CAAC;AACjB,OAAO,KAAK,EAAE,qBAAqB,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AAEhF,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AActD;;;GAGG;AACH,MAAM,WAAW,iBAAiB;IAChC,+DAA+D;IAC/D,IAAI,EAAE,YAAY,EAAE,CAAC;IACrB,6EAA6E;IAC7E,KAAK,CAAC,EAAE,iBAAiB,CAAC;IAC1B,sFAAsF;IACtF,OAAO,CAAC,EAAE,mBAAmB,CAAC;IAC9B,iFAAiF;IACjF,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,uFAAuF;IACvF,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,yEAAyE;IACzE,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB,kFAAkF;IAClF,oBAAoB,CAAC,EAAE,qBAAqB,CAAC;IAC7C,oFAAoF;IACpF,gBAAgB,CAAC,EAAE,iBAAiB,CAAC;IACrC;;;OAGG;IACH,qBAAqB,CAAC,EAAE,WAAW,EAAE,CAAC;IACtC;;;OAGG;IACH,mBAAmB,CAAC,EAAE,CAAC,WAAW,EAAE,WAAW,KAAK,IAAI,CAAC;CAC1D;AAYD,eAAO,MAAM,YAAY,EAAE,EAAE,CAAC,iBAAiB,CAwU9C,CAAC"}
+{"version":3,"file":"FloatingMenu.d.ts","sourceRoot":"","sources":["../../../../src/floatingMenu/FloatingMenu.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,EAAE,EAAqD,MAAM,OAAO,CAAC;AASrF,OAAO,EAAiB,QAAQ,EAAc,MAAM,iBAAiB,CAAC;AACtE,OAAO,KAAK,EACV,YAAY,EACZ,mBAAmB,EACnB,iBAAiB,EAClB,MAAM,SAAS,CAAC;AACjB,OAAO,KAAK,EAAE,qBAAqB,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AAEhF,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AActD;;;GAGG;AACH,MAAM,WAAW,iBAAiB;IAChC,+DAA+D;IAC/D,IAAI,EAAE,YAAY,EAAE,CAAC;IACrB,6EAA6E;IAC7E,KAAK,CAAC,EAAE,iBAAiB,CAAC;IAC1B,sFAAsF;IACtF,OAAO,CAAC,EAAE,mBAAmB,CAAC;IAC9B,iFAAiF;IACjF,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,uFAAuF;IACvF,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,yEAAyE;IACzE,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB,kFAAkF;IAClF,oBAAoB,CAAC,EAAE,qBAAqB,CAAC;IAC7C,oFAAoF;IACpF,gBAAgB,CAAC,EAAE,iBAAiB,CAAC;IACrC;;;OAGG;IACH,qBAAqB,CAAC,EAAE,WAAW,EAAE,CAAC;IACtC;;;OAGG;IACH,mBAAmB,CAAC,EAAE,CAAC,WAAW,EAAE,WAAW,KAAK,IAAI,CAAC;CAC1D;AAWD,eAAO,MAAM,YAAY,EAAE,EAAE,CAAC,iBAAiB,CAwU9C,CAAC"}

package/lib/typescript/commonjs/floatingMenu/autoExternalSync.d.ts

@@ -0,0 +1,21 @@
+import type { EnvVarConfig } from "./FloatingDevTools";
+/** Whether zero-config sync can run (the external-sync package is installed). */
+export declare function isExternalSyncAvailable(): boolean;
+export interface ExternalSyncOptions {
+    /** Broker URL. @default "http://localhost:42831" (the Buoy Desktop app) */
+    socketURL?: string;
+    /** Shown in the desktop device list. @default "<app name> (<platform>)" */
+    deviceName?: string;
+    /** Stable device identity across restarts. @default "<app-slug>-<platform>" */
+    deviceId?: string;
+    /** @default false */
+    enableLogs?: boolean;
+}
+interface AutoExternalSyncProps {
+    options?: ExternalSyncOptions;
+    /** FloatingDevTools' requiredEnvVars — reused for the env tool's adapter. */
+    requiredEnvVars?: EnvVarConfig[];
+}
+export declare function AutoExternalSync({ options, requiredEnvVars, }: AutoExternalSyncProps): null;
+export {};
+//# sourceMappingURL=autoExternalSync.d.ts.map

package/lib/typescript/commonjs/floatingMenu/autoExternalSync.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"autoExternalSync.d.ts","sourceRoot":"","sources":["../../../../src/floatingMenu/autoExternalSync.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAwGvD,iFAAiF;AACjF,wBAAgB,uBAAuB,IAAI,OAAO,CAEjD;AAED,MAAM,WAAW,mBAAmB;IAClC,2EAA2E;IAC3E,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,2EAA2E;IAC3E,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,+EAA+E;IAC/E,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,qBAAqB;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAuBD,UAAU,qBAAqB;IAC7B,OAAO,CAAC,EAAE,mBAAmB,CAAC;IAC9B,6EAA6E;IAC7E,eAAe,CAAC,EAAE,YAAY,EAAE,CAAC;CAClC;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,OAAO,EACP,eAAe,GAChB,EAAE,qBAAqB,QA4EvB"}

package/lib/typescript/commonjs/floatingMenu/defaultConfig.d.ts

@@ -19,7 +19,7 @@
  * All known tool IDs that can appear in the floating menu or dial menu.
  * This is a union type of all auto-discovered tool IDs.
  */
-export type BuiltInToolId = 'env' | 'network' | 'storage' | 'query' | 'query-wifi-toggle' | 'route-events' | 'debug-borders' | 'highlight-updates' | 'highlight-updates-modal';
+export type BuiltInToolId = 'env' | 'network' | 'storage' | 'query' | 'query-wifi-toggle' | 'route-events' | 'debug-borders' | 'highlight-updates' | 'highlight-updates-modal' | 'redux' | 'zustand' | 'jotai' | 'events' | 'image-overlay' | 'perf-monitor' | 'perf-monitor-modal';
 /**
  * Special floating-only tool IDs that only appear in the floating bubble row.
  */