@buoy-gg/image-overlay 7.0.41 → 7.0.43

package/lib/commonjs/imageOverlay/utils/ImageOverlayController.js

@@ -1,426 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.ImageOverlayController = void 0;
-var _reactNative = require("react-native");
-var _componentMeasurement = require("./componentMeasurement");
-var _fiberScanner = require("./fiberScanner");
-var _devtoolsHook = require("./devtoolsHook");
-/**
- * Singleton state manager for the image overlay tool.
- * Bridges the modal (controls) and standalone overlay (rendering).
- * Supports two modes: "component" (match to tagged element) and "free" (drag anywhere).
- */
-
-const DEFAULT_STATE = {
-  mode: null,
-  enabled: false,
-  imageUri: null,
-  imageWidth: null,
-  imageHeight: null,
-  targetTag: null,
-  targetLabel: null,
-  targetRect: null,
-  showOutline: true,
-  opacity: 0.5,
-  scale: 1.0,
-  offsetX: 0,
-  offsetY: 0,
-  invertX: false,
-  invertY: false,
-  locked: false,
-  freeX: 0,
-  freeY: 0,
-  freeWidth: 200,
-  freeHeight: 200
-};
-let state = {
-  ...DEFAULT_STATE
-};
-const listeners = new Set();
-
-// Hold onto references so we can remeasure
-let targetInstance = null;
-let targetLabel = null;
-
-// Auto-tracking via React DevTools traceUpdates
-let autoTrackEnabled = false;
-let traceUnsubscribe = null;
-let trackingNativeTag = null;
-function notify() {
-  for (const listener of listeners) {
-    listener(state);
-  }
-}
-function getNativeTag(instance) {
-  if (!instance) return null;
-  if (typeof instance._nativeTag === "number") return instance._nativeTag;
-  if (typeof instance.canonical?._nativeTag === "number") return instance.canonical._nativeTag;
-  if (typeof instance.__nativeTag === "number") return instance.__nativeTag;
-  return null;
-}
-async function measureWithFallback(instance, label) {
-  let rect = await (0, _componentMeasurement.measureInstance)(instance);
-  if (rect) return {
-    rect,
-    freshInstance: instance
-  };
-  const targets = (0, _fiberScanner.scanForImageTargets)();
-  const fresh = targets.find(t => t.label === label);
-  if (fresh) {
-    rect = await (0, _componentMeasurement.measureInstance)(fresh.instance);
-    if (rect) return {
-      rect,
-      freshInstance: fresh.instance
-    };
-  }
-  return {
-    rect: null,
-    freshInstance: instance
-  };
-}
-
-/**
- * Subscribe to React DevTools traceUpdates to remeasure our target
- * component in real-time whenever ANY component re-renders (which
- * includes scroll events that reposition our target).
- */
-function startTraceTracking() {
-  if (traceUnsubscribe) return; // already tracking
-
-  const hook = (0, _devtoolsHook.getDevToolsHook)();
-  if (!hook) return;
-
-  // Enable trace updates on all renderers (same as highlight-updates)
-  if (hook.rendererInterfaces) {
-    for (const [, renderer] of hook.rendererInterfaces) {
-      if (typeof renderer.setTraceUpdatesEnabled === "function") {
-        renderer.setTraceUpdatesEnabled(true);
-      }
-    }
-  }
-
-  // Subscribe to traceUpdates — fires whenever components render
-  if (typeof hook.sub === "function") {
-    traceUnsubscribe = hook.sub("traceUpdates", handleTraceForAutoTrack);
-  }
-}
-
-/**
- * Remeasure once per frame while Auto Track is on.
- *
- * traceUpdates alone missed the common case: a native scroll moves the target
- * without any React render, so the overlay stayed where the row used to be.
- * One measure in flight at a time, so a slow bridge never queues frames.
- */
-let frameHandle = null;
-let frameMeasuring = false;
-function startFrameTracking() {
-  if (frameHandle !== null || typeof requestAnimationFrame !== "function") return;
-  const tick = () => {
-    frameHandle = requestAnimationFrame(tick);
-    if (frameMeasuring || !autoTrackEnabled || !targetInstance) return;
-    frameMeasuring = true;
-    remeasureTarget().finally(() => {
-      frameMeasuring = false;
-    });
-  };
-  frameHandle = requestAnimationFrame(tick);
-}
-function stopFrameTracking() {
-  if (frameHandle !== null && typeof cancelAnimationFrame === "function") cancelAnimationFrame(frameHandle);
-  frameHandle = null;
-}
-function stopTraceTracking() {
-  stopFrameTracking();
-  if (traceUnsubscribe) {
-    traceUnsubscribe();
-    traceUnsubscribe = null;
-  }
-  // Note: we don't disable traceUpdates on renderers because
-  // highlight-updates may also be using them
-}
-
-/** Called on every traceUpdates event — remeasure our target */
-function handleTraceForAutoTrack(_nodes) {
-  if (!autoTrackEnabled || !targetInstance) return;
-
-  // Don't filter by nativeTag — any render could have caused a layout
-  // shift (e.g. sibling resize, scroll). Just remeasure cheaply.
-  void remeasureTarget();
-}
-function remeasureTarget() {
-  return (0, _componentMeasurement.measureInstance)(targetInstance).then(rect => {
-    if (rect && state.targetRect) {
-      // Only notify if position actually changed
-      const prev = state.targetRect;
-      if (Math.abs(rect.x - prev.x) > 0.5 || Math.abs(rect.y - prev.y) > 0.5 || Math.abs(rect.width - prev.width) > 0.5 || Math.abs(rect.height - prev.height) > 0.5) {
-        state = {
-          ...state,
-          targetRect: rect
-        };
-        notify();
-      }
-    }
-  }).catch(() => {
-    // The target unmounted mid-measure; the next frame tries again.
-  });
-}
-function getImageSize(uri) {
-  return new Promise(resolve => {
-    _reactNative.Image.getSize(uri, (width, height) => resolve({
-      width,
-      height
-    }), () => resolve(null));
-  });
-}
-const ImageOverlayController = exports.ImageOverlayController = {
-  subscribe(listener) {
-    listeners.add(listener);
-    listener(state);
-    return () => listeners.delete(listener);
-  },
-  getState() {
-    return state;
-  },
-  // ─── Component Match Mode ───────────────────────────────────────────
-
-  async setTarget(instance, label, fiber) {
-    targetInstance = instance;
-    targetLabel = label;
-    const instanceToMeasure = fiber?.stateNode ?? instance;
-    const {
-      rect,
-      freshInstance
-    } = await measureWithFallback(instanceToMeasure, label);
-    targetInstance = freshInstance;
-    const tag = getNativeTag(targetInstance);
-    state = {
-      ...state,
-      mode: "component",
-      targetTag: tag,
-      targetLabel: label,
-      targetRect: rect
-    };
-    notify();
-  },
-  async setImageUri(uri) {
-    const size = await getImageSize(uri);
-    let autoScale = 1.0;
-    if (size && state.targetRect && size.width > 0) {
-      autoScale = state.targetRect.width / size.width;
-    }
-    state = {
-      ...state,
-      imageUri: uri,
-      imageWidth: size?.width ?? null,
-      imageHeight: size?.height ?? null,
-      scale: autoScale,
-      showOutline: false
-    };
-    notify();
-  },
-  setOpacity(value) {
-    state = {
-      ...state,
-      opacity: Math.max(0, Math.min(1, value))
-    };
-    notify();
-  },
-  setScale(value) {
-    state = {
-      ...state,
-      scale: Math.max(0.01, Math.min(5, value))
-    };
-    notify();
-  },
-  setOffset(x, y) {
-    state = {
-      ...state,
-      offsetX: x,
-      offsetY: y
-    };
-    notify();
-  },
-  toggleInvertX() {
-    state = {
-      ...state,
-      invertX: !state.invertX
-    };
-    notify();
-  },
-  toggleInvertY() {
-    state = {
-      ...state,
-      invertY: !state.invertY
-    };
-    notify();
-  },
-  setLocked(locked) {
-    state = {
-      ...state,
-      locked
-    };
-    notify();
-  },
-  setAutoTrack(enabled) {
-    autoTrackEnabled = enabled;
-    if (enabled) {
-      startTraceTracking();
-      startFrameTracking();
-    } else {
-      stopTraceTracking();
-    }
-  },
-  isAutoTracking() {
-    return autoTrackEnabled;
-  },
-  setShowOutline(show) {
-    state = {
-      ...state,
-      showOutline: show
-    };
-    notify();
-  },
-  setEnabled(enabled) {
-    state = {
-      ...state,
-      enabled
-    };
-    notify();
-  },
-  toggle() {
-    state = {
-      ...state,
-      enabled: !state.enabled
-    };
-    notify();
-  },
-  fitWidth() {
-    if (state.imageWidth && state.targetRect && state.imageWidth > 0) {
-      state = {
-        ...state,
-        scale: state.targetRect.width / state.imageWidth
-      };
-      notify();
-    }
-  },
-  fitHeight() {
-    if (state.imageHeight && state.targetRect && state.imageHeight > 0) {
-      state = {
-        ...state,
-        scale: state.targetRect.height / state.imageHeight
-      };
-      notify();
-    }
-  },
-  resetSettings() {
-    if (state.mode === "free") {
-      const screen = _reactNative.Dimensions.get("window");
-      const w = state.imageWidth ?? 200;
-      const h = state.imageHeight ?? 200;
-      state = {
-        ...state,
-        opacity: 0.5,
-        freeX: (screen.width - w) / 2,
-        freeY: (screen.height - h) / 2,
-        freeWidth: w,
-        freeHeight: h
-      };
-    } else {
-      let autoScale = 1.0;
-      if (state.imageWidth && state.targetRect && state.imageWidth > 0) {
-        autoScale = state.targetRect.width / state.imageWidth;
-      }
-      state = {
-        ...state,
-        opacity: 0.5,
-        scale: autoScale,
-        offsetX: 0,
-        offsetY: 0
-      };
-    }
-    notify();
-  },
-  async remeasure() {
-    if (!targetLabel) return;
-    const {
-      rect,
-      freshInstance
-    } = await measureWithFallback(targetInstance, targetLabel);
-    targetInstance = freshInstance;
-    if (rect) {
-      state = {
-        ...state,
-        targetRect: rect
-      };
-      notify();
-    }
-  },
-  // ─── Free Placement Mode ───────────────────────────────────────────
-
-  async startFreeMode(uri) {
-    const size = await getImageSize(uri);
-    const screen = _reactNative.Dimensions.get("window");
-    const w = size?.width ?? 200;
-    const h = size?.height ?? 200;
-
-    // Scale down if image is larger than 80% of screen
-    let displayW = w;
-    let displayH = h;
-    const maxW = screen.width * 0.8;
-    const maxH = screen.height * 0.6;
-    if (displayW > maxW || displayH > maxH) {
-      const ratio = Math.min(maxW / displayW, maxH / displayH);
-      displayW = Math.round(displayW * ratio);
-      displayH = Math.round(displayH * ratio);
-    }
-    state = {
-      ...state,
-      mode: "free",
-      enabled: true,
-      imageUri: uri,
-      imageWidth: size?.width ?? null,
-      imageHeight: size?.height ?? null,
-      opacity: 0.5,
-      freeX: Math.round((screen.width - displayW) / 2),
-      freeY: Math.round((screen.height - displayH) / 2),
-      freeWidth: Math.round(displayW),
-      freeHeight: Math.round(displayH)
-    };
-    notify();
-  },
-  setFreePosition(x, y) {
-    state = {
-      ...state,
-      freeX: x,
-      freeY: y
-    };
-    notify();
-  },
-  setFreeDimensions(width, height, x, y) {
-    state = {
-      ...state,
-      freeWidth: width,
-      freeHeight: height,
-      freeX: x,
-      freeY: y
-    };
-    notify();
-  },
-  // ─── Shared ─────────────────────────────────────────────────────────
-
-  reset() {
-    stopTraceTracking();
-    autoTrackEnabled = false;
-    trackingNativeTag = null;
-    targetInstance = null;
-    targetLabel = null;
-    state = {
-      ...DEFAULT_STATE
-    };
-    notify();
-  }
-};
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.ImageOverlayController=void 0;var _reactNative=require("react-native");var _componentMeasurement=require("./componentMeasurement");var _fiberScanner=require("./fiberScanner");var _devtoolsHook=require("./devtoolsHook");const DEFAULT_STATE={mode:null,enabled:false,imageUri:null,imageWidth:null,imageHeight:null,targetTag:null,targetLabel:null,targetRect:null,showOutline:true,opacity:.5,scale:1,offsetX:0,offsetY:0,invertX:false,invertY:false,locked:false,freeX:0,freeY:0,freeWidth:200,freeHeight:200};let state={...DEFAULT_STATE};const listeners=new Set;let targetInstance=null;let targetLabel=null;let autoTrackEnabled=false;let traceUnsubscribe=null;let trackingNativeTag=null;function notify(){for(const e of listeners){e(state)}}function getNativeTag(e){if(!e)return null;if(typeof e._nativeTag==="number")return e._nativeTag;if(typeof e.canonical?._nativeTag==="number")return e.canonical._nativeTag;if(typeof e.__nativeTag==="number")return e.__nativeTag;return null}async function measureWithFallback(e,t){let a=await(0,_componentMeasurement.measureInstance)(e);if(a)return{rect:a,freshInstance:e};const r=(0,_fiberScanner.scanForImageTargets)();const s=r.find(n=>n.label===t);if(s){a=await(0,_componentMeasurement.measureInstance)(s.instance);if(a)return{rect:a,freshInstance:s.instance}}return{rect:null,freshInstance:e}}function startTraceTracking(){if(traceUnsubscribe)return;const e=(0,_devtoolsHook.getDevToolsHook)();if(!e)return;if(e.rendererInterfaces){for(const[,t]of e.rendererInterfaces){if(typeof t.setTraceUpdatesEnabled==="function"){t.setTraceUpdatesEnabled(true)}}}if(typeof e.sub==="function"){traceUnsubscribe=e.sub("traceUpdates",handleTraceForAutoTrack)}}let frameHandle=null;let frameMeasuring=false;function startFrameTracking(){if(frameHandle!==null||typeof requestAnimationFrame!=="function")return;const e=()=>{frameHandle=requestAnimationFrame(e);if(frameMeasuring||!autoTrackEnabled||!targetInstance)return;frameMeasuring=true;remeasureTarget().finally(()=>{frameMeasuring=false})};frameHandle=requestAnimationFrame(e)}function stopFrameTracking(){if(frameHandle!==null&&typeof cancelAnimationFrame==="function")cancelAnimationFrame(frameHandle);frameHandle=null}function stopTraceTracking(){stopFrameTracking();if(traceUnsubscribe){traceUnsubscribe();traceUnsubscribe=null}}function handleTraceForAutoTrack(e){if(!autoTrackEnabled||!targetInstance)return;void remeasureTarget()}function remeasureTarget(){return(0,_componentMeasurement.measureInstance)(targetInstance).then(e=>{if(e&&state.targetRect){const t=state.targetRect;if(Math.abs(e.x-t.x)>.5||Math.abs(e.y-t.y)>.5||Math.abs(e.width-t.width)>.5||Math.abs(e.height-t.height)>.5){state={...state,targetRect:e};notify()}}}).catch(()=>{})}function getImageSize(e){return new Promise(t=>{_reactNative.Image.getSize(e,(a,r)=>t({width:a,height:r}),()=>t(null))})}const ImageOverlayController=exports.ImageOverlayController={subscribe(e){listeners.add(e);e(state);return()=>listeners.delete(e)},getState(){return state},async setTarget(e,t,a){targetInstance=e;targetLabel=t;const r=a?.stateNode??e;const{rect:s,freshInstance:n}=await measureWithFallback(r,t);targetInstance=n;const i=getNativeTag(targetInstance);state={...state,mode:"component",targetTag:i,targetLabel:t,targetRect:s};notify()},async setImageUri(e){const t=await getImageSize(e);let a=1;if(t&&state.targetRect&&t.width>0){a=state.targetRect.width/t.width}state={...state,imageUri:e,imageWidth:t?.width??null,imageHeight:t?.height??null,scale:a,showOutline:false};notify()},setOpacity(e){state={...state,opacity:Math.max(0,Math.min(1,e))};notify()},setScale(e){state={...state,scale:Math.max(.01,Math.min(5,e))};notify()},setOffset(e,t){state={...state,offsetX:e,offsetY:t};notify()},toggleInvertX(){state={...state,invertX:!state.invertX};notify()},toggleInvertY(){state={...state,invertY:!state.invertY};notify()},setLocked(e){state={...state,locked:e};notify()},setAutoTrack(e){autoTrackEnabled=e;if(e){startTraceTracking();startFrameTracking()}else{stopTraceTracking()}},isAutoTracking(){return autoTrackEnabled},setShowOutline(e){state={...state,showOutline:e};notify()},setEnabled(e){state={...state,enabled:e};notify()},toggle(){state={...state,enabled:!state.enabled};notify()},fitWidth(){if(state.imageWidth&&state.targetRect&&state.imageWidth>0){state={...state,scale:state.targetRect.width/state.imageWidth};notify()}},fitHeight(){if(state.imageHeight&&state.targetRect&&state.imageHeight>0){state={...state,scale:state.targetRect.height/state.imageHeight};notify()}},resetSettings(){if(state.mode==="free"){const e=_reactNative.Dimensions.get("window");const t=state.imageWidth??200;const a=state.imageHeight??200;state={...state,opacity:.5,freeX:(e.width-t)/2,freeY:(e.height-a)/2,freeWidth:t,freeHeight:a}}else{let e=1;if(state.imageWidth&&state.targetRect&&state.imageWidth>0){e=state.targetRect.width/state.imageWidth}state={...state,opacity:.5,scale:e,offsetX:0,offsetY:0}}notify()},async remeasure(){if(!targetLabel)return;const{rect:e,freshInstance:t}=await measureWithFallback(targetInstance,targetLabel);targetInstance=t;if(e){state={...state,targetRect:e};notify()}},async startFreeMode(e){const t=await getImageSize(e);const a=_reactNative.Dimensions.get("window");const r=t?.width??200;const s=t?.height??200;let n=r;let i=s;const o=a.width*.8;const l=a.height*.6;if(n>o||i>l){const c=Math.min(o/n,l/i);n=Math.round(n*c);i=Math.round(i*c)}state={...state,mode:"free",enabled:true,imageUri:e,imageWidth:t?.width??null,imageHeight:t?.height??null,opacity:.5,freeX:Math.round((a.width-n)/2),freeY:Math.round((a.height-i)/2),freeWidth:Math.round(n),freeHeight:Math.round(i)};notify()},setFreePosition(e,t){state={...state,freeX:e,freeY:t};notify()},setFreeDimensions(e,t,a,r){state={...state,freeWidth:e,freeHeight:t,freeX:a,freeY:r};notify()},reset(){stopTraceTracking();autoTrackEnabled=false;trackingNativeTag=null;targetInstance=null;targetLabel=null;state={...DEFAULT_STATE};notify()}};

package/lib/commonjs/imageOverlay/utils/componentMeasurement.js

@@ -1,106 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.measureInstance = measureInstance;
-var _reactNative = require("react-native");
-/**
- * Component measurement utilities for image overlay positioning.
- * Adapted from debug-borders/utils/componentMeasurement.js
- *
- * Supports both Fabric (new arch) and Paper (legacy) measurement APIs.
- */
-
-/**
- * Measures a component instance and returns its screen-space bounding rect.
- * Tries multiple strategies to handle Fabric, Paper, and edge cases.
- */
-function measureInstance(instance) {
-  return new Promise(resolve => {
-    try {
-      // Build a list of candidates to try measuring
-      const candidates = [];
-
-      // Direct instance (ReactFabricHostComponent has measure/getBoundingClientRect)
-      if (instance) candidates.push(instance);
-
-      // Fabric: instance.canonical.publicInstance
-      if (instance?.canonical?.publicInstance) {
-        candidates.push(instance.canonical.publicInstance);
-      }
-      // Fabric fallback: instance.canonical itself
-      if (instance?.canonical && instance.canonical !== instance) {
-        candidates.push(instance.canonical);
-      }
-
-      // Try getBoundingClientRect first (modern Fabric, synchronous)
-      for (const publicInstance of candidates) {
-        if (typeof publicInstance.getBoundingClientRect === "function") {
-          try {
-            const rect = publicInstance.getBoundingClientRect();
-            if (rect && typeof rect.x === "number" && typeof rect.y === "number" && typeof rect.width === "number" && typeof rect.height === "number" && rect.width > 0 && rect.height > 0) {
-              resolve({
-                x: rect.x,
-                y: rect.y,
-                width: rect.width,
-                height: rect.height
-              });
-              return;
-            }
-          } catch {
-            // Try next candidate
-          }
-        }
-      }
-
-      // Try measure() callback on all candidates
-      for (const publicInstance of candidates) {
-        if (typeof publicInstance.measure === "function") {
-          const timeout = setTimeout(() => resolve(null), 200);
-          publicInstance.measure((_x, _y, width, height, pageX, pageY) => {
-            clearTimeout(timeout);
-            if (pageX != null && pageY != null && width != null && height != null && width > 0 && height > 0) {
-              resolve({
-                x: pageX,
-                y: pageY,
-                width,
-                height
-              });
-            } else {
-              resolve(null);
-            }
-          });
-          return;
-        }
-      }
-
-      // Last resort: try findNodeHandle + UIManager.measure
-      try {
-        const nodeHandle = (0, _reactNative.findNodeHandle)(instance);
-        if (nodeHandle != null) {
-          const timeout = setTimeout(() => resolve(null), 200);
-          _reactNative.UIManager.measure(nodeHandle, (_x, _y, width, height, pageX, pageY) => {
-            clearTimeout(timeout);
-            if (pageX != null && pageY != null && width != null && height != null && width > 0 && height > 0) {
-              resolve({
-                x: pageX,
-                y: pageY,
-                width,
-                height
-              });
-            } else {
-              resolve(null);
-            }
-          });
-          return;
-        }
-      } catch {
-        // findNodeHandle not available or failed
-      }
-      resolve(null);
-    } catch {
-      resolve(null);
-    }
-  });
-}
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.measureInstance=measureInstance;var _reactNative=require("react-native");function measureInstance(t){return new Promise(u=>{try{const o=[];if(t)o.push(t);if(t?.canonical?.publicInstance){o.push(t.canonical.publicInstance)}if(t?.canonical&&t.canonical!==t){o.push(t.canonical)}for(const e of o){if(typeof e.getBoundingClientRect==="function"){try{const n=e.getBoundingClientRect();if(n&&typeof n.x==="number"&&typeof n.y==="number"&&typeof n.width==="number"&&typeof n.height==="number"&&n.width>0&&n.height>0){u({x:n.x,y:n.y,width:n.width,height:n.height});return}}catch{}}}for(const e of o){if(typeof e.measure==="function"){const n=setTimeout(()=>u(null),200);e.measure((a,f,l,c,i,r)=>{clearTimeout(n);if(i!=null&&r!=null&&l!=null&&c!=null&&l>0&&c>0){u({x:i,y:r,width:l,height:c})}else{u(null)}});return}}try{const e=(0,_reactNative.findNodeHandle)(t);if(e!=null){const n=setTimeout(()=>u(null),200);_reactNative.UIManager.measure(e,(a,f,l,c,i,r)=>{clearTimeout(n);if(i!=null&&r!=null&&l!=null&&c!=null&&l>0&&c>0){u({x:i,y:r,width:l,height:c})}else{u(null)}});return}}catch{}u(null)}catch{u(null)}})}

package/lib/commonjs/imageOverlay/utils/devtoolsHook.js

@@ -1,36 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.getDevToolsHook = getDevToolsHook;
-exports.setDevToolsHookOverride = setDevToolsHookOverride;
-/**
- * Single accessor for the React DevTools global hook.
- *
- * Both the fiber scanner (target discovery) and the controller (auto-track via
- * traceUpdates) reach for `__REACT_DEVTOOLS_GLOBAL_HOOK__`. Routing both through
- * here gives embedded hosts — the docs-site live demo, and any future desktop
- * port — one place to substitute their own hook, so the tool never instruments
- * the host page's React renderer just because someone flipped Auto Track.
- *
- * On device nothing calls setDevToolsHookOverride, so this stays a plain
- * passthrough to the global.
- */
-
-let hookOverride = null;
-
-/**
- * Substitute the hook the tool reads. Pass null to fall back to the global.
- * The override only needs the parts the tool actually uses:
- * `getFiberRoots(rendererId)`, and optionally `sub("traceUpdates", fn)` plus
- * `rendererInterfaces` for auto-track.
- */
-function setDevToolsHookOverride(hook) {
-  hookOverride = hook ?? null;
-}
-function getDevToolsHook() {
-  if (hookOverride) return hookOverride;
-  if (typeof global === "undefined") return null;
-  return global.__REACT_DEVTOOLS_GLOBAL_HOOK__ ?? null;
-}
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.getDevToolsHook=getDevToolsHook;exports.setDevToolsHookOverride=setDevToolsHookOverride;let hookOverride=null;function setDevToolsHookOverride(e){hookOverride=e??null}function getDevToolsHook(){if(hookOverride)return hookOverride;if(typeof global==="undefined")return null;return global.__REACT_DEVTOOLS_GLOBAL_HOOK__??null}

package/lib/commonjs/imageOverlay/utils/fiberScanner.js

@@ -1,104 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.scanForImageTargets = scanForImageTargets;
-var _devtoolsHook = require("./devtoolsHook");
-/**
- * Fiber tree scanner for discovering image-overlay targets.
- * Finds components tagged with testID="image-target:LabelName".
- *
- * Core traversal adapted from debug-borders/utils/fiberTreeTraversal.js
- */
-
-const IMAGE_TARGET_PREFIX = "image-target:";
-
-// Fiber tag constants (from React internals)
-const HostComponent = 5;
-const OffscreenComponent = 22;
-function getFiberRoots() {
-  const hook = (0, _devtoolsHook.getDevToolsHook)();
-  if (!hook?.getFiberRoots) return [];
-  const roots = new Set();
-  const ids = hook.renderers?.keys ? Array.from(hook.renderers.keys()) : [1];
-  for (const id of ids) {
-    try {
-      hook.getFiberRoots(id)?.forEach(root => roots.add(root));
-    } catch {/* Other renderers can still provide roots. */}
-  }
-  return [...roots];
-}
-function isHiddenOffscreen(fiber) {
-  return fiber.tag === OffscreenComponent && fiber.memoizedState !== null;
-}
-function isInactiveScreen(fiber) {
-  return fiber.memoizedProps?.activityState === 0;
-}
-function traverseFiberTree(fiber, callback, depth = 0, visited = new Set()) {
-  if (!fiber || visited.has(fiber) || depth > 500) return;
-  visited.add(fiber);
-  if (isHiddenOffscreen(fiber)) {
-    if (fiber.sibling) traverseFiberTree(fiber.sibling, callback, depth, visited);
-    return;
-  }
-  if (isInactiveScreen(fiber)) {
-    if (fiber.sibling) traverseFiberTree(fiber.sibling, callback, depth, visited);
-    return;
-  }
-  callback(fiber, depth);
-  if (fiber.child) traverseFiberTree(fiber.child, callback, depth + 1, visited);
-  if (fiber.sibling) traverseFiberTree(fiber.sibling, callback, depth, visited);
-}
-
-/**
- * Walk the fiber tree upward to find the owning user-defined React component name.
- */
-function getOwningComponentName(fiber) {
-  const internalNames = new Set(["View", "RCTView", "Text", "RCTText", "Image", "RCTImageView", "ScrollView", "RCTScrollView", "TextInput", "RCTTextInput", "TouchableOpacity", "TouchableHighlight", "TouchableWithoutFeedback", "Pressable", "FlatList", "SectionList", "SafeAreaView"]);
-  let current = fiber._debugOwner || fiber.return;
-  let depth = 0;
-  while (current && depth < 30) {
-    depth++;
-    const type = current.type;
-    if (type) {
-      const name = typeof type === "string" ? type : type.displayName || type.name;
-      if (name && !internalNames.has(name)) {
-        return name;
-      }
-    }
-    current = current.return;
-  }
-  return null;
-}
-
-/**
- * Scan the React fiber tree for components with testID="image-target:*".
- * Returns an array of discovered targets with their fiber references for measurement.
- */
-function scanForImageTargets() {
-  const roots = getFiberRoots();
-  if (roots.length === 0) return [];
-  const targets = [];
-  for (const root of roots) {
-    traverseFiberTree(root.current, fiber => {
-      if (fiber.tag !== HostComponent) return;
-
-      // react-native-web rewrites testID to data-testid before it reaches the
-      // host fiber, so read both — otherwise the scanner finds nothing in any
-      // RNW-rendered tree (example-web, the docs-site live demo).
-      const testID = fiber.memoizedProps?.testID ?? fiber.pendingProps?.testID ?? fiber.memoizedProps?.["data-testid"] ?? fiber.pendingProps?.["data-testid"];
-      if (!testID || !testID.startsWith(IMAGE_TARGET_PREFIX)) return;
-      const label = testID.slice(IMAGE_TARGET_PREFIX.length);
-      if (!label) return;
-      targets.push({
-        label,
-        testID,
-        fiber,
-        instance: fiber.stateNode,
-        componentName: getOwningComponentName(fiber)
-      });
-    });
-  }
-  return targets;
-}
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.scanForImageTargets=scanForImageTargets;var _devtoolsHook=require("./devtoolsHook");const IMAGE_TARGET_PREFIX="image-target:";const HostComponent=5;const OffscreenComponent=22;function getFiberRoots(){const t=(0,_devtoolsHook.getDevToolsHook)();if(!t?.getFiberRoots)return[];const o=new Set;const n=t.renderers?.keys?Array.from(t.renderers.keys()):[1];for(const e of n){try{t.getFiberRoots(e)?.forEach(s=>o.add(s))}catch{}}return[...o]}function isHiddenOffscreen(t){return t.tag===OffscreenComponent&&t.memoizedState!==null}function isInactiveScreen(t){return t.memoizedProps?.activityState===0}function traverseFiberTree(t,o,n=0,e=new Set){if(!t||e.has(t)||n>500)return;e.add(t);if(isHiddenOffscreen(t)){if(t.sibling)traverseFiberTree(t.sibling,o,n,e);return}if(isInactiveScreen(t)){if(t.sibling)traverseFiberTree(t.sibling,o,n,e);return}o(t,n);if(t.child)traverseFiberTree(t.child,o,n+1,e);if(t.sibling)traverseFiberTree(t.sibling,o,n,e)}function getOwningComponentName(t){const o=new Set(["View","RCTView","Text","RCTText","Image","RCTImageView","ScrollView","RCTScrollView","TextInput","RCTTextInput","TouchableOpacity","TouchableHighlight","TouchableWithoutFeedback","Pressable","FlatList","SectionList","SafeAreaView"]);let n=t._debugOwner||t.return;let e=0;while(n&&e<30){e++;const s=n.type;if(s){const r=typeof s==="string"?s:s.displayName||s.name;if(r&&!o.has(r)){return r}}n=n.return}return null}function scanForImageTargets(){const t=getFiberRoots();if(t.length===0)return[];const o=[];for(const n of t){traverseFiberTree(n.current,e=>{if(e.tag!==HostComponent)return;const s=e.memoizedProps?.testID??e.pendingProps?.testID??e.memoizedProps?.["data-testid"]??e.pendingProps?.["data-testid"];if(!s||!s.startsWith(IMAGE_TARGET_PREFIX))return;const r=s.slice(IMAGE_TARGET_PREFIX.length);if(!r)return;o.push({label:r,testID:s,fiber:e,instance:e.stateNode,componentName:getOwningComponentName(e)})})}return o}