@buoy-gg/debug-borders 3.0.2 → 4.0.1

package/lib/commonjs/debug-borders/components/DebugBordersStandaloneOverlay.js

@@ -53,14 +53,27 @@ const {
   resolveOverlappingLabels
 } = require("../utils/labelPositioning");
 
-// Import DevToolsVisibility context to detect when DevTools are open
-let useDevToolsVisibility = null;
-try {
-  // Optional import - will gracefully fail if not available
-  const coreModule = require("@buoy-gg/core");
-  useDevToolsVisibility = coreModule.useDevToolsVisibility;
-} catch (e) {
-  // DevToolsVisibility not available, that's ok - borders will always work
+// Import DevToolsVisibility context to detect when DevTools are open.
+//
+// Resolved lazily (on first render) instead of at module load to avoid a
+// require cycle: @buoy-gg/core -> FloatingDevTools -> autoExternalSync ->
+// @buoy-gg/debug-borders -> preset -> this file -> @buoy-gg/core.
+// Deferring the require breaks the cycle while keeping the optional dependency.
+
+let useDevToolsVisibility;
+function resolveUseDevToolsVisibility() {
+  if (useDevToolsVisibility !== undefined) {
+    return useDevToolsVisibility;
+  }
+  try {
+    // Optional import - will gracefully fail if not available
+    const coreModule = require("@buoy-gg/core");
+    useDevToolsVisibility = coreModule.useDevToolsVisibility ?? null;
+  } catch (e) {
+    // DevToolsVisibility not available, that's ok - borders will always work
+    useDevToolsVisibility = null;
+  }
+  return useDevToolsVisibility ?? null;
 }
 // Row component for displaying info
 function InfoRow({
@@ -216,8 +229,10 @@ function DebugBordersStandaloneOverlay() {
   const [modalVisible, setModalVisible] = (0, _react.useState)(false);
   const measuringRef = _react.default.useRef(false); // Prevent overlapping measurements
 
-  // Check if any DevTools are open (if context is available)
-  const isDevToolsActive = useDevToolsVisibility?.()?.isDevToolsActive ?? false;
+  // Check if any DevTools are open (if context is available).
+  // The hook reference is resolved lazily but is stable for the app's lifetime,
+  // so calling it conditionally here is safe across renders.
+  const isDevToolsActive = resolveUseDevToolsVisibility()?.()?.isDevToolsActive ?? false;
   const handleLabelPress = (0, _react.useCallback)(rect => {
     setSelectedRect(rect);
     setModalVisible(true);

package/lib/module/debug-borders/components/DebugBordersStandaloneOverlay.js

@@ -49,14 +49,27 @@ const {
   resolveOverlappingLabels
 } = require("../utils/labelPositioning");
 
-// Import DevToolsVisibility context to detect when DevTools are open
-let useDevToolsVisibility = null;
-try {
-  // Optional import - will gracefully fail if not available
-  const coreModule = require("@buoy-gg/core");
-  useDevToolsVisibility = coreModule.useDevToolsVisibility;
-} catch (e) {
-  // DevToolsVisibility not available, that's ok - borders will always work
+// Import DevToolsVisibility context to detect when DevTools are open.
+//
+// Resolved lazily (on first render) instead of at module load to avoid a
+// require cycle: @buoy-gg/core -> FloatingDevTools -> autoExternalSync ->
+// @buoy-gg/debug-borders -> preset -> this file -> @buoy-gg/core.
+// Deferring the require breaks the cycle while keeping the optional dependency.
+
+let useDevToolsVisibility;
+function resolveUseDevToolsVisibility() {
+  if (useDevToolsVisibility !== undefined) {
+    return useDevToolsVisibility;
+  }
+  try {
+    // Optional import - will gracefully fail if not available
+    const coreModule = require("@buoy-gg/core");
+    useDevToolsVisibility = coreModule.useDevToolsVisibility ?? null;
+  } catch (e) {
+    // DevToolsVisibility not available, that's ok - borders will always work
+    useDevToolsVisibility = null;
+  }
+  return useDevToolsVisibility ?? null;
 }
 // Row component for displaying info
 function InfoRow({
@@ -212,8 +225,10 @@ export function DebugBordersStandaloneOverlay() {
   const [modalVisible, setModalVisible] = useState(false);
   const measuringRef = React.useRef(false); // Prevent overlapping measurements
 
-  // Check if any DevTools are open (if context is available)
-  const isDevToolsActive = useDevToolsVisibility?.()?.isDevToolsActive ?? false;
+  // Check if any DevTools are open (if context is available).
+  // The hook reference is resolved lazily but is stable for the app's lifetime,
+  // so calling it conditionally here is safe across renders.
+  const isDevToolsActive = resolveUseDevToolsVisibility()?.()?.isDevToolsActive ?? false;
   const handleLabelPress = useCallback(rect => {
     setSelectedRect(rect);
     setModalVisible(true);

package/lib/typescript/debug-borders/components/DebugBordersStandaloneOverlay.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DebugBordersStandaloneOverlay.d.ts","sourceRoot":"","sources":["../../../../src/debug-borders/components/DebugBordersStandaloneOverlay.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AAEH,OAAO,KAA2C,MAAM,OAAO,CAAC;AAmMhE,wBAAgB,6BAA6B,6BAmL5C"}
+{"version":3,"file":"DebugBordersStandaloneOverlay.d.ts","sourceRoot":"","sources":["../../../../src/debug-borders/components/DebugBordersStandaloneOverlay.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AAEH,OAAO,KAA2C,MAAM,OAAO,CAAC;AAiNhE,wBAAgB,6BAA6B,6BAsL5C"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@buoy-gg/debug-borders",
-  "version": "3.0.2",
+  "version": "4.0.1",
   "description": "debug-borders package",
   "main": "lib/commonjs/index.js",
   "module": "lib/module/index.js",
@@ -26,19 +26,19 @@
   ],
   "sideEffects": false,
   "dependencies": {
-    "@buoy-gg/core": "3.0.2",
-    "@buoy-gg/shared-ui": "3.0.2"
+    "@buoy-gg/core": "4.0.1",
+    "@buoy-gg/shared-ui": "4.0.1"
   },
   "peerDependencies": {
     "react": "*",
     "react-native": "*",
-    "@buoy-gg/license": "3.0.2"
+    "@buoy-gg/license": "4.0.1"
   },
   "devDependencies": {
     "@types/react": "^19.1.0",
     "@types/react-native": "^0.73.0",
     "typescript": "~5.8.3",
-    "@buoy-gg/license": "3.0.2"
+    "@buoy-gg/license": "4.0.1"
   },
   "react-native-builder-bob": {
     "source": "src",