@buoy-gg/debug-borders 7.0.41 → 7.0.43

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

@@ -1,438 +1 @@
-"use strict";
-
-/**
- * Standalone Debug Borders Overlay
- *
- * This component renders debug borders independently of the Provider.
- * It should be rendered at the root level of the app to ensure it appears on top.
- *
- * Supports two display modes:
- * - "borders" - Shows colored borders only
- * - "labels" - Shows colored borders with component labels
- *
- * Automatically hides borders when DevTools modals are open to avoid visual clutter.
- */
-
-import React, { useEffect, useState, useCallback } from "react";
-import { View, Text, StyleSheet, TouchableOpacity } from "react-native";
-import { monoFont } from "@buoy-gg/shared-ui";
-import { JsModal, devToolsStorageKeys } from '@buoy-gg/shared-ui';
-import { DataViewer } from '@buoy-gg/shared-ui/dataViewer';
-import { loadToolModule } from '@buoy-gg/shared-ui/utils';
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-const infoModalKey = devToolsStorageKeys.debugBorders.infoModal();
-const DebugBordersManager = require("../utils/DebugBordersManager");
-const {
-  getAllHostComponentInstances
-} = require("../utils/fiberTreeTraversal");
-const {
-  measureInstances
-} = require("../utils/componentMeasurement");
-const {
-  getColorForDepth
-} = require("../utils/colorGeneration");
-const {
-  getShortLabel
-} = require("../utils/componentInfo");
-const {
-  resolveOverlappingLabels
-} = require("../utils/labelPositioning");
-
-// 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 = loadToolModule("@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({
-  label,
-  value,
-  color
-}) {
-  if (value === null || value === undefined) return null;
-  let displayValue;
-  if (typeof value === "object") {
-    try {
-      displayValue = JSON.stringify(value, null, 2);
-    } catch {
-      displayValue = String(value);
-    }
-  } else {
-    displayValue = String(value);
-  }
-  return /*#__PURE__*/_jsxs(View, {
-    style: modalStyles.row,
-    children: [/*#__PURE__*/_jsx(Text, {
-      style: modalStyles.label,
-      children: label
-    }), /*#__PURE__*/_jsx(Text, {
-      style: [modalStyles.value, color ? {
-        color
-      } : null],
-      children: displayValue
-    })]
-  });
-}
-
-// Simple header with just title (no hints)
-function SimpleHeader({
-  title
-}) {
-  return /*#__PURE__*/_jsx(View, {
-    style: headerStyles.container,
-    children: /*#__PURE__*/_jsx(Text, {
-      style: headerStyles.title,
-      numberOfLines: 1,
-      children: title
-    })
-  });
-}
-
-// Component Info Modal Content
-function ComponentInfoContent({
-  info,
-  rect
-}) {
-  return /*#__PURE__*/_jsxs(View, {
-    style: modalStyles.content,
-    children: [/*#__PURE__*/_jsx(Text, {
-      style: modalStyles.sectionTitle,
-      children: "Identifiers"
-    }), /*#__PURE__*/_jsx(InfoRow, {
-      label: "testID",
-      value: info.testID,
-      color: "#10b981"
-    }), /*#__PURE__*/_jsx(InfoRow, {
-      label: "accessibilityLabel",
-      value: info.accessibilityLabel,
-      color: "#ec4899"
-    }), /*#__PURE__*/_jsx(InfoRow, {
-      label: "nativeID",
-      value: info.nativeID,
-      color: "#f59e0b"
-    }), /*#__PURE__*/_jsx(InfoRow, {
-      label: "key",
-      value: info.fiberKey
-    }), /*#__PURE__*/_jsx(Text, {
-      style: modalStyles.sectionTitle,
-      children: "Component"
-    }), /*#__PURE__*/_jsx(InfoRow, {
-      label: "Component Name",
-      value: info.componentName,
-      color: "#a855f7"
-    }), /*#__PURE__*/_jsx(InfoRow, {
-      label: "Parent Component",
-      value: info.parentComponentName
-    }), /*#__PURE__*/_jsx(InfoRow, {
-      label: "Display Name",
-      value: info.displayName
-    }), /*#__PURE__*/_jsx(InfoRow, {
-      label: "Native View Type",
-      value: info.viewType
-    }), /*#__PURE__*/_jsx(InfoRow, {
-      label: "Fiber Tag",
-      value: info.fiberTag
-    }), /*#__PURE__*/_jsx(Text, {
-      style: modalStyles.sectionTitle,
-      children: "Position & Size"
-    }), /*#__PURE__*/_jsx(InfoRow, {
-      label: "X",
-      value: Math.round(rect.x)
-    }), /*#__PURE__*/_jsx(InfoRow, {
-      label: "Y",
-      value: Math.round(rect.y)
-    }), /*#__PURE__*/_jsx(InfoRow, {
-      label: "Width",
-      value: Math.round(rect.width)
-    }), /*#__PURE__*/_jsx(InfoRow, {
-      label: "Height",
-      value: Math.round(rect.height)
-    }), /*#__PURE__*/_jsx(InfoRow, {
-      label: "Depth",
-      value: rect.depth
-    }), (info.accessibilityRole || info.accessibilityHint || info.accessibilityState) && /*#__PURE__*/_jsxs(_Fragment, {
-      children: [/*#__PURE__*/_jsx(Text, {
-        style: modalStyles.sectionTitle,
-        children: "Accessibility"
-      }), /*#__PURE__*/_jsx(InfoRow, {
-        label: "Role",
-        value: info.accessibilityRole
-      }), /*#__PURE__*/_jsx(InfoRow, {
-        label: "Hint",
-        value: info.accessibilityHint
-      }), info.accessibilityState && DataViewer ? /*#__PURE__*/_jsx(DataViewer, {
-        title: "",
-        data: info.accessibilityState,
-        showTypeFilter: true,
-        rawMode: true,
-        initialExpanded: true
-      }) : /*#__PURE__*/_jsx(InfoRow, {
-        label: "State",
-        value: info.accessibilityState
-      })]
-    }), info.styleInfo && /*#__PURE__*/_jsxs(_Fragment, {
-      children: [/*#__PURE__*/_jsx(Text, {
-        style: modalStyles.sectionTitle,
-        children: "Styles"
-      }), DataViewer ? /*#__PURE__*/_jsx(DataViewer, {
-        title: "",
-        data: info.styleInfo,
-        showTypeFilter: true,
-        rawMode: true,
-        initialExpanded: true
-      }) : /*#__PURE__*/_jsx(View, {
-        style: modalStyles.codeBlock,
-        children: /*#__PURE__*/_jsx(Text, {
-          style: modalStyles.codeText,
-          children: JSON.stringify(info.styleInfo, null, 2)
-        })
-      })]
-    })]
-  });
-}
-export function DebugBordersStandaloneOverlay() {
-  const [mode, setMode] = useState("off");
-  const [rectangles, setRectangles] = useState([]);
-  const [selectedRect, setSelectedRect] = useState(null);
-  const [modalVisible, setModalVisible] = useState(false);
-  const measuringRef = React.useRef(false); // Prevent overlapping measurements
-
-  // 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);
-  }, []);
-  const handleCloseModal = useCallback(() => {
-    setModalVisible(false);
-    setSelectedRect(null);
-  }, []);
-
-  // Effective enabled state: user enabled AND no DevTools active
-  const isEnabled = mode !== "off" && !isDevToolsActive;
-  const showLabels = mode === "labels" && !isDevToolsActive;
-
-  // Subscribe to manager
-  useEffect(() => {
-    const unsubscribe = DebugBordersManager.subscribe(newMode => {
-      setMode(newMode);
-    });
-    return unsubscribe;
-  }, []);
-
-  // Update measurements when enabled
-  useEffect(() => {
-    if (!isEnabled) {
-      setRectangles([]);
-      return;
-    }
-    let mounted = true;
-    let timer;
-    const updateMeasurements = async () => {
-      if (!mounted || measuringRef.current) {
-        return;
-      }
-      measuringRef.current = true;
-      try {
-        const instances = getAllHostComponentInstances();
-        if (instances.length === 0) {
-          measuringRef.current = false;
-          return;
-        }
-        const measurements = await measureInstances(instances);
-        if (mounted) {
-          // Resolve overlapping labels when in labels mode
-          const processedMeasurements = showLabels ? resolveOverlappingLabels(measurements) : measurements;
-          setRectangles(processedMeasurements);
-        }
-      } catch (error) {
-        console.error("[DebugBorders] Error updating measurements:", error);
-      } finally {
-        measuringRef.current = false;
-      }
-    };
-
-    // Initial measurement with delay to let UI settle
-    const initialTimer = setTimeout(() => {
-      updateMeasurements();
-    }, 500);
-
-    // Periodic updates (less frequent to avoid performance issues)
-    timer = setInterval(updateMeasurements, 2000);
-    return () => {
-      mounted = false;
-      clearTimeout(initialTimer);
-      clearInterval(timer);
-      measuringRef.current = false;
-    };
-  }, [isEnabled, showLabels, rectangles.length]);
-  if (!isEnabled) {
-    return null;
-  }
-  return /*#__PURE__*/_jsxs(View, {
-    style: styles.overlay,
-    pointerEvents: "box-none"
-    // @ts-ignore - custom prop to identify this as debug overlay
-    ,
-    dataSet: {
-      debugOverlay: "true"
-    },
-    nativeID: "debug-borders-overlay",
-    children: [rectangles.map((rect, index) => {
-      const info = rect.componentInfo;
-      const hasValidLabel = info && (info.testID || info.accessibilityLabel);
-
-      // In labels mode, only show components with testID or accessibilityLabel
-      if (showLabels && !hasValidLabel) {
-        return null;
-      }
-
-      // Use label color for border when in labels mode, otherwise use depth-based color
-      const borderColor = showLabels && info ? info.primaryColor : getColorForDepth(rect.depth);
-      return /*#__PURE__*/_jsxs(React.Fragment, {
-        children: [/*#__PURE__*/_jsx(View, {
-          pointerEvents: "none",
-          style: [styles.border, {
-            left: rect.x,
-            top: rect.y,
-            width: rect.width,
-            height: rect.height,
-            borderColor: borderColor
-          }]
-        }), showLabels && hasValidLabel && /*#__PURE__*/_jsx(TouchableOpacity, {
-          activeOpacity: 0.7,
-          onPress: () => handleLabelPress(rect),
-          style: [styles.labelContainer, {
-            left: rect.x,
-            top: rect.y - 10 - (rect.labelOffsetY || 0),
-            backgroundColor: info.primaryColor
-          }],
-          children: /*#__PURE__*/_jsx(Text, {
-            style: styles.labelText,
-            numberOfLines: 1,
-            children: info.primaryLabel
-          })
-        })]
-      }, `border-${index}`);
-    }), JsModal && selectedRect?.componentInfo && /*#__PURE__*/_jsx(JsModal, {
-      visible: modalVisible,
-      onClose: handleCloseModal,
-      initialMode: "bottomSheet",
-      header: {
-        customContent: /*#__PURE__*/_jsx(SimpleHeader, {
-          title: selectedRect.componentInfo.primaryLabel
-        })
-      },
-      persistenceKey: infoModalKey,
-      enablePersistence: false,
-      children: /*#__PURE__*/_jsx(ComponentInfoContent, {
-        info: selectedRect.componentInfo,
-        rect: selectedRect
-      })
-    })]
-  });
-}
-const styles = StyleSheet.create({
-  overlay: {
-    position: "absolute",
-    top: 0,
-    left: 0,
-    right: 0,
-    bottom: 0,
-    // Use z-index below floating dev tools (9999-10001) but above normal app content
-    zIndex: 9000,
-    elevation: 9000
-  },
-  border: {
-    position: "absolute",
-    borderWidth: 1,
-    borderStyle: "solid"
-  },
-  labelContainer: {
-    position: "absolute",
-    paddingHorizontal: 4,
-    paddingVertical: 1,
-    borderRadius: 2
-  },
-  labelText: {
-    fontSize: 8,
-    fontWeight: "700",
-    fontFamily: monoFont,
-    color: "#ffffff"
-  }
-});
-const headerStyles = StyleSheet.create({
-  container: {
-    paddingHorizontal: 16,
-    paddingVertical: 8,
-    alignItems: "center"
-  },
-  title: {
-    fontSize: 16,
-    fontWeight: "600",
-    color: "#ffffff",
-    fontFamily: monoFont
-  }
-});
-const modalStyles = StyleSheet.create({
-  content: {
-    padding: 16
-  },
-  sectionTitle: {
-    fontSize: 12,
-    fontWeight: "700",
-    color: "#6b7280",
-    marginTop: 16,
-    marginBottom: 8,
-    textTransform: "uppercase",
-    letterSpacing: 1
-  },
-  row: {
-    flexDirection: "row",
-    paddingVertical: 8,
-    borderBottomWidth: 1,
-    borderBottomColor: "rgba(255, 255, 255, 0.1)"
-  },
-  label: {
-    fontSize: 13,
-    color: "#9ca3af",
-    width: 140,
-    fontFamily: monoFont
-  },
-  value: {
-    fontSize: 13,
-    color: "#ffffff",
-    flex: 1,
-    fontFamily: monoFont
-  },
-  codeBlock: {
-    backgroundColor: "rgba(0, 0, 0, 0.3)",
-    padding: 12,
-    borderRadius: 8,
-    marginTop: 4
-  },
-  codeText: {
-    fontSize: 11,
-    color: "#e5e7eb",
-    fontFamily: monoFont
-  }
-});
+"use strict";import V,{useEffect as L,useState as T,useCallback as R}from"react";import{View as d,Text as a,StyleSheet as x,TouchableOpacity as q}from"react-native";import{monoFont as p}from"@buoy-gg/shared-ui";import{JsModal as z,devToolsStorageKeys as P}from"@buoy-gg/shared-ui";import{DataViewer as S}from"@buoy-gg/shared-ui/dataViewer";import{loadToolModule as W}from"@buoy-gg/shared-ui/utils";import{jsx as e,jsxs as b,Fragment as B}from"react/jsx-runtime";const j=P.debugBorders.infoModal();const A=require("../utils/DebugBordersManager");const{getAllHostComponentInstances:K}=require("../utils/fiberTreeTraversal");const{measureInstances:J}=require("../utils/componentMeasurement");const{getColorForDepth:_}=require("../utils/colorGeneration");const{getShortLabel:ne}=require("../utils/componentInfo");const{resolveOverlappingLabels:Y}=require("../utils/labelPositioning");let h;function G(){if(h!==void 0){return h}try{const t=W("@buoy-gg/core");h=t.useDevToolsVisibility??null}catch(t){h=null}return h??null}function o({label:t,value:n,color:f}){if(n===null||n===void 0)return null;let s;if(typeof n==="object"){try{s=JSON.stringify(n,null,2)}catch{s=String(n)}}else{s=String(n)}return b(d,{style:r.row,children:[e(a,{style:r.label,children:t}),e(a,{style:[r.value,f?{color:f}:null],children:s})]})}function U({title:t}){return e(d,{style:O.container,children:e(a,{style:O.title,numberOfLines:1,children:t})})}function X({info:t,rect:n}){return b(d,{style:r.content,children:[e(a,{style:r.sectionTitle,children:"Identifiers"}),e(o,{label:"testID",value:t.testID,color:"#10b981"}),e(o,{label:"accessibilityLabel",value:t.accessibilityLabel,color:"#ec4899"}),e(o,{label:"nativeID",value:t.nativeID,color:"#f59e0b"}),e(o,{label:"key",value:t.fiberKey}),e(a,{style:r.sectionTitle,children:"Component"}),e(o,{label:"Component Name",value:t.componentName,color:"#a855f7"}),e(o,{label:"Parent Component",value:t.parentComponentName}),e(o,{label:"Display Name",value:t.displayName}),e(o,{label:"Native View Type",value:t.viewType}),e(o,{label:"Fiber Tag",value:t.fiberTag}),e(a,{style:r.sectionTitle,children:"Position & Size"}),e(o,{label:"X",value:Math.round(n.x)}),e(o,{label:"Y",value:Math.round(n.y)}),e(o,{label:"Width",value:Math.round(n.width)}),e(o,{label:"Height",value:Math.round(n.height)}),e(o,{label:"Depth",value:n.depth}),(t.accessibilityRole||t.accessibilityHint||t.accessibilityState)&&b(B,{children:[e(a,{style:r.sectionTitle,children:"Accessibility"}),e(o,{label:"Role",value:t.accessibilityRole}),e(o,{label:"Hint",value:t.accessibilityHint}),t.accessibilityState&&S?e(S,{title:"",data:t.accessibilityState,showTypeFilter:true,rawMode:true,initialExpanded:true}):e(o,{label:"State",value:t.accessibilityState})]}),t.styleInfo&&b(B,{children:[e(a,{style:r.sectionTitle,children:"Styles"}),S?e(S,{title:"",data:t.styleInfo,showTypeFilter:true,rawMode:true,initialExpanded:true}):e(d,{style:r.codeBlock,children:e(a,{style:r.codeText,children:JSON.stringify(t.styleInfo,null,2)})})]})]})}export function DebugBordersStandaloneOverlay(){const[t,n]=T("off");const[f,s]=T([]);const[g,D]=T(null);const[H,M]=T(false);const y=V.useRef(false);const w=G()?.()?.isDevToolsActive??false;const N=R(l=>{D(l);M(true)},[]);const E=R(()=>{M(false);D(null)},[]);const C=t!=="off"&&!w;const m=t==="labels"&&!w;L(()=>{const l=A.subscribe(c=>{n(c)});return l},[]);L(()=>{if(!C){s([]);return}let l=true;let c;const i=async()=>{if(!l||y.current){return}y.current=true;try{const u=K();if(u.length===0){y.current=false;return}const F=await J(u);if(l){const k=m?Y(F):F;s(k)}}catch(u){console.error("[DebugBorders] Error updating measurements:",u)}finally{y.current=false}};const v=setTimeout(()=>{i()},500);c=setInterval(i,2e3);return()=>{l=false;clearTimeout(v);clearInterval(c);y.current=false}},[C,m,f.length]);if(!C){return null}return b(d,{style:I.overlay,pointerEvents:"box-none",dataSet:{debugOverlay:"true"},nativeID:"debug-borders-overlay",children:[f.map((l,c)=>{const i=l.componentInfo;const v=i&&(i.testID||i.accessibilityLabel);if(m&&!v){return null}const u=m&&i?i.primaryColor:_(l.depth);return b(V.Fragment,{children:[e(d,{pointerEvents:"none",style:[I.border,{left:l.x,top:l.y,width:l.width,height:l.height,borderColor:u}]}),m&&v&&e(q,{activeOpacity:.7,onPress:()=>N(l),style:[I.labelContainer,{left:l.x,top:l.y-10-(l.labelOffsetY||0),backgroundColor:i.primaryColor}],children:e(a,{style:I.labelText,numberOfLines:1,children:i.primaryLabel})})]},`border-${c}`)}),z&&g?.componentInfo&&e(z,{visible:H,onClose:E,initialMode:"bottomSheet",header:{customContent:e(U,{title:g.componentInfo.primaryLabel})},persistenceKey:j,enablePersistence:false,children:e(X,{info:g.componentInfo,rect:g})})]})}const I=x.create({overlay:{position:"absolute",top:0,left:0,right:0,bottom:0,zIndex:9e3,elevation:9e3},border:{position:"absolute",borderWidth:1,borderStyle:"solid"},labelContainer:{position:"absolute",paddingHorizontal:4,paddingVertical:1,borderRadius:2},labelText:{fontSize:8,fontWeight:"700",fontFamily:p,color:"#ffffff"}});const O=x.create({container:{paddingHorizontal:16,paddingVertical:8,alignItems:"center"},title:{fontSize:16,fontWeight:"600",color:"#ffffff",fontFamily:p}});const r=x.create({content:{padding:16},sectionTitle:{fontSize:12,fontWeight:"700",color:"#6b7280",marginTop:16,marginBottom:8,textTransform:"uppercase",letterSpacing:1},row:{flexDirection:"row",paddingVertical:8,borderBottomWidth:1,borderBottomColor:"rgba(255, 255, 255, 0.1)"},label:{fontSize:13,color:"#9ca3af",width:140,fontFamily:p},value:{fontSize:13,color:"#ffffff",flex:1,fontFamily:p},codeBlock:{backgroundColor:"rgba(0, 0, 0, 0.3)",padding:12,borderRadius:8,marginTop:4},codeText:{fontSize:11,color:"#e5e7eb",fontFamily:p}});

package/lib/module/debug-borders/index.js

@@ -1,15 +1 @@
-"use strict";
-
-// Export types
-export * from "./types";
-
-// Export components
-export { DebugBordersModal } from "./components/DebugBordersModal";
-export { DebugBordersStandaloneOverlay } from "./components/DebugBordersStandaloneOverlay";
-
-// Export utilities (JS modules - will be typed when converted to TS)
-// Note: These are CommonJS modules, so we use require for now
-export const DebugBordersManager = require("./utils/DebugBordersManager");
-export const fiberTreeTraversal = require("./utils/fiberTreeTraversal");
-export const componentMeasurement = require("./utils/componentMeasurement");
-export const colorGeneration = require("./utils/colorGeneration");
+"use strict";export*from"./types";export{DebugBordersModal}from"./components/DebugBordersModal";export{DebugBordersStandaloneOverlay}from"./components/DebugBordersStandaloneOverlay";export const DebugBordersManager=require("./utils/DebugBordersManager");export const fiberTreeTraversal=require("./utils/fiberTreeTraversal");export const componentMeasurement=require("./utils/componentMeasurement");export const colorGeneration=require("./utils/colorGeneration");

package/lib/module/debug-borders/types.js

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

package/lib/module/debug-borders/utils/DebugBordersManager.js

@@ -1,121 +1 @@
-"use strict";
-
-import { loadToolModule } from '@buoy-gg/shared-ui/utils';
-"use strict";
-let globalMode = "off";
-const listeners = new Set();
-const MODE_CYCLE_FULL = ["off", "borders", "labels"];
-const MODE_CYCLE_FREE = ["off", "borders"];
-let _isPro = null;
-let _licenseLoadAttempted = false;
-function loadLicenseModule() {
-  if (_licenseLoadAttempted) return;
-  _licenseLoadAttempted = true;
-  try {
-    const mod = loadToolModule("@buoy-gg/license");
-    if (mod && typeof mod.isPro === "function") {
-      _isPro = mod.isPro;
-    }
-  } catch {
-    _isPro = null;
-  }
-}
-function checkIsPro() {
-  loadLicenseModule();
-  if (_isPro) {
-    try {
-      return _isPro();
-    } catch {
-      return false;
-    }
-  }
-  return false;
-}
-function getModeCycle() {
-  return checkIsPro() ? MODE_CYCLE_FULL : MODE_CYCLE_FREE;
-}
-const MODE_CYCLE = MODE_CYCLE_FULL;
-function subscribe(listener) {
-  listeners.add(listener);
-  listener(globalMode);
-  return () => {
-    listeners.delete(listener);
-  };
-}
-function notifyListeners() {
-  listeners.forEach(listener => {
-    try {
-      listener(globalMode);
-    } catch (error) {
-      console.error("[DebugBorders] Error in listener:", error);
-    }
-  });
-}
-function setMode(mode) {
-  if (globalMode === mode) {
-    return true;
-  }
-  if (mode === "labels" && !checkIsPro()) {
-    console.warn("[DebugBorders] Labels mode requires React Buoy Pro. Upgrade at https://buoy.gg/pro");
-    return false;
-  }
-  globalMode = mode;
-  notifyListeners();
-  return true;
-}
-function getMode() {
-  return globalMode;
-}
-function cycle() {
-  const availableModes = getModeCycle();
-  const currentIndex = availableModes.indexOf(globalMode);
-  if (currentIndex === -1) {
-    setMode("off");
-    return;
-  }
-  const nextIndex = (currentIndex + 1) % availableModes.length;
-  setMode(availableModes[nextIndex]);
-}
-function enable() {
-  setMode("borders");
-}
-function disable() {
-  setMode("off");
-}
-function toggle() {
-  cycle();
-}
-function isEnabled() {
-  return globalMode !== "off";
-}
-function showLabels() {
-  return globalMode === "labels" && checkIsPro();
-}
-function isProEnabled() {
-  return checkIsPro();
-}
-function getAvailableModes() {
-  return getModeCycle();
-}
-function setEnabled(enabled) {
-  if (enabled) {
-    enable();
-  } else {
-    disable();
-  }
-}
-module.exports = {
-  subscribe,
-  enable,
-  disable,
-  toggle,
-  cycle,
-  isEnabled,
-  showLabels,
-  setEnabled,
-  getMode,
-  setMode,
-  isProEnabled,
-  getAvailableModes,
-  MODE_CYCLE
-};
+"use strict";import{loadToolModule as g}from"@buoy-gg/shared-ui/utils";"use strict";let n="off";const u=new Set;const c=["off","borders","labels"];const E=["off","borders"];let r=null;let l=false;function M(){if(l)return;l=true;try{const e=g("@buoy-gg/license");if(e&&typeof e.isPro==="function"){r=e.isPro}}catch{r=null}}function s(){M();if(r){try{return r()}catch{return false}}return false}function f(){return s()?c:E}const y=c;function L(e){u.add(e);e(n);return()=>{u.delete(e)}}function h(){u.forEach(e=>{try{e(n)}catch(o){console.error("[DebugBorders] Error in listener:",o)}})}function t(e){if(n===e){return true}if(e==="labels"&&!s()){console.warn("[DebugBorders] Labels mode requires React Buoy Pro. Upgrade at https://buoy.gg/pro");return false}n=e;h();return true}function p(){return n}function i(){const e=f();const o=e.indexOf(n);if(o===-1){t("off");return}const b=(o+1)%e.length;t(e[b])}function a(){t("borders")}function d(){t("off")}function C(){i()}function _(){return n!=="off"}function P(){return n==="labels"&&s()}function x(){return s()}function D(){return f()}function m(e){if(e){a()}else{d()}}module.exports={subscribe:L,enable:a,disable:d,toggle:C,cycle:i,isEnabled:_,showLabels:P,setEnabled:m,getMode:p,setMode:t,isProEnabled:x,getAvailableModes:D,MODE_CYCLE:y};