@buoy-gg/highlight-updates 7.0.35 → 7.0.38

package/lib/module/preset.js

@@ -1,272 +1 @@
-"use strict";
-
-/**
- * Pre-configured highlight updates tool for FloatingDevTools
- *
- * This preset provides standalone "Highlight updates when components render"
- * functionality. Tap the icon to toggle highlights on/off.
- *
- * The overlay is automatically rendered by FloatingDevTools when the
- * @buoy-gg/highlight-updates package is installed.
- *
- * Two presets available:
- * - highlightUpdatesPreset: Quick toggle (no modal)
- * - highlightUpdatesModalPreset: Full modal with filters and render list
- *
- * @example
- * ```tsx
- * import { highlightUpdatesPreset, highlightUpdatesModalPreset } from '@buoy-gg/highlight-updates';
- *
- * // Toggle-only: Just tap to enable/disable highlighting
- * <FloatingDevTools apps={[highlightUpdatesPreset]} />
- *
- * // Modal: Opens interface with filters, render list, and controls
- * <FloatingDevTools apps={[highlightUpdatesModalPreset]} />
- * ```
- */
-
-import React, { useState, useEffect, useCallback } from "react";
-import { HighlighterIcon, HighlightIcon as HighlightIconBase } from "@buoy-gg/floating-tools-core";
-import HighlightUpdatesController from "./highlight-updates/utils/HighlightUpdatesController";
-import { HighlightUpdatesModal } from "./highlight-updates/components/HighlightUpdatesModal";
-
-/**
- * Icon component that changes color based on enabled state.
- *
- * ⚠️ IMPORTANT - DO NOT MODIFY THIS COMPONENT ⚠️
- * This component MUST use useState and useEffect hooks to subscribe to the controller.
- * It is rendered as a JSX component (<IconComponent />) in FloatingMenu and DialIcon,
- * which allows hooks to work properly.
- *
- * If you remove the hooks or change this to read isEnabled() directly,
- * the icon color will NOT update when the toggle is pressed.
- */
-import { jsx as _jsx } from "react/jsx-runtime";
-function HighlightIcon({
-  size
-}) {
-  const [enabled, setEnabled] = useState(() => HighlightUpdatesController.isEnabled());
-  useEffect(() => {
-    const unsubscribe = HighlightUpdatesController.subscribe(isEnabled => {
-      setEnabled(isEnabled);
-    });
-    return unsubscribe;
-  }, []);
-  return /*#__PURE__*/_jsx(HighlightIconBase, {
-    size: size,
-    color: enabled ? "#10b981" : "#6b7280"
-  });
-}
-
-/**
- * Empty component for toggle-only tools (no modal needed)
- * The actual overlay is rendered by FloatingDevTools automatically
- */
-function EmptyComponent() {
-  return null;
-}
-
-/**
- * Wrapper component for the modal that handles badge press navigation.
- * Registers a callback with the controller to receive badge press events
- * and passes the target nativeTag to the modal for deep linking.
- */
-function HighlightUpdatesModalWithBadgeNavigation(props) {
-  const [targetNativeTag, setTargetNativeTag] = useState(null);
-
-  // Register badge press callback when modal is visible
-  useEffect(() => {
-    if (props.visible) {
-      // Register callback to handle badge presses
-      HighlightUpdatesController.setBadgePressCallback(nativeTag => {
-        setTargetNativeTag(nativeTag);
-      });
-    }
-    return () => {
-      // Clear callback when modal is closed or unmounted
-      if (!props.visible) {
-        HighlightUpdatesController.setBadgePressCallback(null);
-      }
-    };
-  }, [props.visible]);
-
-  // Clear the target after it's been handled
-  const handleInitialNativeTagHandled = useCallback(() => {
-    setTargetNativeTag(null);
-  }, []);
-  return /*#__PURE__*/_jsx(HighlightUpdatesModal, {
-    ...props,
-    initialNativeTag: targetNativeTag,
-    onInitialNativeTagHandled: handleInitialNativeTagHandled
-  });
-}
-
-/**
- * Pre-configured highlight updates tool for FloatingDevTools.
- * Tap the icon to toggle component render highlighting on/off.
- *
- * Features:
- * - Standalone implementation - no DevTools connection required
- * - Simple direct toggle (no modal)
- * - Icon changes color: gray when off, green when on
- * - Overlay auto-rendered by FloatingDevTools
- */
-export const highlightUpdatesPreset = {
-  id: "highlight-updates",
-  name: "TOGGLE HIGHLIGHT",
-  description: "Toggle component render highlights",
-  slot: "row",
-  icon: HighlightIcon,
-  component: EmptyComponent,
-  props: {},
-  launchMode: "toggle-only",
-  onPress: () => {
-    // Initialize on first press if not already initialized
-    if (!HighlightUpdatesController.isInitialized()) {
-      HighlightUpdatesController.initialize();
-    }
-    HighlightUpdatesController.toggle();
-    // Icon updates automatically via subscription in HighlightIcon component
-  }
-};
-
-/**
- * Create a custom highlight updates tool configuration.
- * Use this if you want to override default settings.
- *
- * @example
- * ```tsx
- * import { createHighlightUpdatesTool } from '@buoy-gg/highlight-updates';
- *
- * const myHighlightTool = createHighlightUpdatesTool({
- *   name: "RENDERS",
- *   enabledColor: "#ec4899",
- *   disabledColor: "#9ca3af",
- *   autoInitialize: true,
- * });
- * ```
- */
-export function createHighlightUpdatesTool(options) {
-  const enabledColor = options?.enabledColor || "#10b981";
-  const disabledColor = options?.disabledColor || "#6b7280";
-
-  // Auto-initialize if requested
-  if (options?.autoInitialize) {
-    // Delay to allow DevTools to connect
-    setTimeout(() => {
-      HighlightUpdatesController.initialize();
-    }, 1000);
-  }
-
-  /**
-   * Custom icon component with hooks - rendered as JSX component.
-   *
-   * ⚠️ IMPORTANT - DO NOT MODIFY THIS COMPONENT ⚠️
-   * This component MUST use useState and useEffect hooks to subscribe to the controller.
-   * See the comment on HighlightIcon above for full explanation.
-   */
-  const CustomHighlightIcon = ({
-    size
-  }) => {
-    const [enabled, setEnabled] = useState(() => HighlightUpdatesController.isEnabled());
-    useEffect(() => {
-      const unsubscribe = HighlightUpdatesController.subscribe(isEnabled => {
-        setEnabled(isEnabled);
-      });
-      return unsubscribe;
-    }, []);
-    return /*#__PURE__*/_jsx(HighlightIconBase, {
-      size: size,
-      color: enabled ? enabledColor : disabledColor
-    });
-  };
-  return {
-    id: options?.id || "highlight-updates",
-    name: options?.name || "TOGGLE HIGHLIGHT",
-    description: options?.description || "Toggle component render highlights",
-    slot: "row",
-    icon: CustomHighlightIcon,
-    component: EmptyComponent,
-    props: {},
-    launchMode: "toggle-only",
-    onPress: () => {
-      // Initialize on first press if not already initialized
-      if (!HighlightUpdatesController.isInitialized()) {
-        HighlightUpdatesController.initialize();
-      }
-      HighlightUpdatesController.toggle();
-      // Icon updates automatically via subscription
-    }
-  };
-}
-
-/**
- * Modal preset for highlight updates tool.
- * Opens a full modal interface with:
- * - List of tracked component renders
- * - Start/Stop and Pause/Resume controls
- * - Clear button to reset render counts
- * - Search bar in navbar (expandable)
- * - Filter by viewType, testID, nativeID, componentName
- * - Tap overlay badge to jump to component detail view
- *
- * Use this preset when you want detailed render tracking and filtering.
- */
-export const highlightUpdatesModalPreset = {
-  id: "highlight-updates-modal",
-  name: "HIGHLIGHT",
-  description: "View component render tracking modal",
-  slot: "both",
-  icon: ({
-    size
-  }) => /*#__PURE__*/_jsx(HighlighterIcon, {
-    size: size
-  }),
-  component: HighlightUpdatesModalWithBadgeNavigation,
-  props: {
-    enableSharedModalDimensions: false
-  }
-};
-
-/**
- * Create a custom highlight updates modal tool configuration.
- * Use this if you want to override default settings for the modal version.
- *
- * @example
- * ```tsx
- * import { createHighlightUpdatesModalTool } from '@buoy-gg/highlight-updates';
- *
- * const myRendersTool = createHighlightUpdatesModalTool({
- *   name: "PROFILER",
- *   enabledColor: "#8b5cf6",
- *   disabledColor: "#9ca3af",
- * });
- * ```
- */
-export function createHighlightUpdatesModalTool(options) {
-  const enabledColor = options?.enabledColor || "#10b981";
-  const disabledColor = options?.disabledColor || "#6b7280";
-
-  // Auto-initialize if requested
-  if (options?.autoInitialize) {
-    setTimeout(() => {
-      HighlightUpdatesController.initialize();
-    }, 1000);
-  }
-  return {
-    id: options?.id || "highlight-updates-modal",
-    name: options?.name || "HIGHLIGHT",
-    description: options?.description || "View component render tracking modal",
-    slot: "both",
-    icon: ({
-      size
-    }) => /*#__PURE__*/_jsx(HighlighterIcon, {
-      size: size,
-      color: enabledColor
-    }),
-    component: HighlightUpdatesModalWithBadgeNavigation,
-    props: {
-      enableSharedModalDimensions: false
-    }
-  };
-}
+"use strict";import React,{useState,useEffect,useCallback}from"react";import{HighlighterIcon,HighlightIcon as HighlightIconBase}from"@buoy-gg/floating-tools-core";import HighlightUpdatesController from"./highlight-updates/utils/HighlightUpdatesController";import{HighlightUpdatesModal}from"./highlight-updates/components/HighlightUpdatesModal";import{jsx as _jsx}from"react/jsx-runtime";function HighlightIcon({size:t}){const[i,e]=useState(()=>HighlightUpdatesController.isEnabled());return useEffect(()=>HighlightUpdatesController.subscribe(t=>{e(t)}),[]),_jsx(HighlightIconBase,{size:t,color:i?"#10b981":"#6b7280"})}function EmptyComponent(){return null}function HighlightUpdatesModalWithBadgeNavigation(t){const[i,e]=useState(null);useEffect(()=>(t.visible&&HighlightUpdatesController.setBadgePressCallback(t=>{e(t)}),()=>{t.visible||HighlightUpdatesController.setBadgePressCallback(null)}),[t.visible]);const o=useCallback(()=>{e(null)},[]);return _jsx(HighlightUpdatesModal,{...t,initialNativeTag:i,onInitialNativeTagHandled:o})}export const highlightUpdatesPreset={id:"highlight-updates",name:"TOGGLE HIGHLIGHT",description:"Toggle component render highlights",slot:"row",icon:HighlightIcon,component:EmptyComponent,props:{},launchMode:"toggle-only",onPress:()=>{HighlightUpdatesController.isInitialized()||HighlightUpdatesController.initialize(),HighlightUpdatesController.toggle()}};export function createHighlightUpdatesTool(t){const i=t?.enabledColor||"#10b981",e=t?.disabledColor||"#6b7280";return t?.autoInitialize&&setTimeout(()=>{HighlightUpdatesController.initialize()},1e3),{id:t?.id||"highlight-updates",name:t?.name||"TOGGLE HIGHLIGHT",description:t?.description||"Toggle component render highlights",slot:"row",icon:({size:t})=>{const[o,l]=useState(()=>HighlightUpdatesController.isEnabled());return useEffect(()=>HighlightUpdatesController.subscribe(t=>{l(t)}),[]),_jsx(HighlightIconBase,{size:t,color:o?i:e})},component:EmptyComponent,props:{},launchMode:"toggle-only",onPress:()=>{HighlightUpdatesController.isInitialized()||HighlightUpdatesController.initialize(),HighlightUpdatesController.toggle()}}}export const highlightUpdatesModalPreset={id:"highlight-updates-modal",name:"HIGHLIGHT",description:"View component render tracking modal",slot:"both",icon:({size:t})=>_jsx(HighlighterIcon,{size:t}),component:HighlightUpdatesModalWithBadgeNavigation,props:{enableSharedModalDimensions:!1}};export function createHighlightUpdatesModalTool(t){const i=t?.enabledColor||"#10b981";return t?.autoInitialize&&setTimeout(()=>{HighlightUpdatesController.initialize()},1e3),{id:t?.id||"highlight-updates-modal",name:t?.name||"HIGHLIGHT",description:t?.description||"View component render tracking modal",slot:"both",icon:({size:t})=>_jsx(HighlighterIcon,{size:t,color:i}),component:HighlightUpdatesModalWithBadgeNavigation,props:{enableSharedModalDimensions:!1}}}

package/lib/module/sync/highlightUpdatesSyncAdapter.js

@@ -1,230 +1 @@
-"use strict";
-
-import HighlightUpdatesController from "../highlight-updates/utils/HighlightUpdatesController";
-import { RenderTracker } from "../highlight-updates/utils/RenderTracker";
-import { describeScreen, tapElement, waitFor } from "../highlight-updates/utils/screenElements";
-import { clearTouchCapture, getTouchCaptureStatus, readTouchCapture, startTouchCapture, stopTouchCapture } from "../highlight-updates/utils/touchCapture";
-import { CommitProfiler } from "../highlight-updates/utils/CommitProfiler";
-function ensureInitialized() {
-  if (!HighlightUpdatesController.isInitialized()) {
-    HighlightUpdatesController.initialize();
-  }
-}
-function toWireCause(cause) {
-  if (!cause) return undefined;
-  const {
-    hookChanges: _hookChanges,
-    ...rest
-  } = cause;
-  return rest;
-}
-
-/**
- * Wire-form render: keep identity + counts + last cause type, drop the
- * per-component history buffer (up to 20 events, and hook/prop snapshots
- * when those settings are on). Dashboards fetch history via getRenderDetail.
- */
-function toWireRender(render) {
-  const {
-    renderHistory,
-    lastRenderCause,
-    ...rest
-  } = render;
-  return {
-    ...rest,
-    lastRenderCause: toWireCause(lastRenderCause),
-    historyCount: renderHistory?.length ?? 0
-  };
-}
-
-/**
- * Deliberately serializes to test serializability, unlike the snapshot guards
- * elsewhere. This runs once per `getRenderDetail` — a user clicking one row —
- * not on the ~5x/sec snapshot, so there is no unbounded per-tick cost to
- * avoid. Probing with a size walk first would just traverse the whole render
- * before doing this anyway.
- */
-function jsonSafeRender(render) {
-  try {
-    JSON.stringify(render);
-    return render;
-  } catch {
-    return {
-      ...render,
-      lastRenderCause: toWireCause(render.lastRenderCause),
-      renderHistory: render.renderHistory?.map(event => ({
-        ...event,
-        capturedProps: undefined,
-        capturedState: undefined,
-        cause: toWireCause(event.cause) ?? event.cause
-      }))
-    };
-  }
-}
-
-/**
- * Measurement window for automated callers (MCP `measure_renders`).
- *
- * Backed by CommitProfiler, NOT the RenderTracker that feeds the overlay, and
- * the difference is the whole point. RenderTracker tracks HOST VIEWS: ask it
- * why `DealRow` re-rendered and it answers about the native `View` inside it —
- * "props changed: accessibilityState, accessibilityValue" — which is true and
- * useless. CommitProfiler walks COMPOSITE fibers, so it answers about the
- * component you named: which of ITS props changed, whether they changed by
- * value or only by identity, and which parent dragged it along.
- *
- * It also touches none of the user's overlay state — no enabling, no clearing
- * counters someone was collecting, nothing drawn on screen. A measurement is
- * invisible.
- */
-function beginMeasurement() {
-  if (!CommitProfiler.isSupported()) {
-    return {
-      ok: false,
-      reason: "render capture needs a dev build with the React DevTools hook available"
-    };
-  }
-  CommitProfiler.startCapture({
-    detail: true
-  });
-  return {
-    ok: true
-  };
-}
-function endMeasurement() {
-  return {
-    summary: CommitProfiler.stopCapture()
-  };
-}
-
-/**
- * Sync adapter for the highlight-updates tool, consumed by
- * @buoy-gg/external-sync's `useExternalSync` (structurally matches its
- * ToolSyncAdapter interface so this package doesn't need a dependency on it).
- *
- * The visual highlights draw on the DEVICE's UI, but the render-tracking
- * data (component list, render counts, causes, history) is plain data — the
- * snapshot carries it so the dashboard renders the real HighlightUpdatesModal
- * as a mirror. Mutations (toggle, freeze, clear, spotlight) come back as
- * actions and run on the device; spotlight even highlights the component on
- * the phone screen while browsing details from the desktop.
- *
- * v2: per-component `renderHistory` (and hook-change values on lastRenderCause)
- * stay on the device. Dashboards fetch them via `getRenderDetail`.
- */
-export const highlightUpdatesSyncAdapter = {
-  // v3: beginMeasurement / endMeasurement — a CommitProfiler capture window
-  // for automated callers, with per-component causes. Invisible to the user.
-  version: 3,
-  getSnapshot: () => ({
-    enabled: HighlightUpdatesController.isEnabled(),
-    frozen: HighlightUpdatesController.getFrozen(),
-    // True while tracking but the visual boxes are hidden (screenshot tool).
-    highlightsSuppressed: HighlightUpdatesController.getHighlightsSuppressed(),
-    renders: RenderTracker.getRenders().map(toWireRender),
-    trackerState: RenderTracker.getState()
-  }),
-  subscribe: onChange => {
-    const unsubscribeEnabled = HighlightUpdatesController.subscribe(onChange);
-    const unsubscribeFreeze = HighlightUpdatesController.subscribeToFreeze(onChange);
-    const unsubscribeRenders = RenderTracker.subscribe(onChange);
-    const unsubscribeTrackerState = RenderTracker.subscribeToState(onChange);
-    return () => {
-      unsubscribeEnabled();
-      unsubscribeFreeze();
-      unsubscribeRenders();
-      unsubscribeTrackerState();
-    };
-  },
-  actions: {
-    // Capture window for automated callers (MCP `measure_renders`). Pairs:
-    // begin -> drive the UI -> end. `end` always restores.
-    beginMeasurement: () => beginMeasurement(),
-    endMeasurement: () => endMeasurement(),
-    /**
-     * On-demand detail: one component's real renderHistory + lastRenderCause
-     * (including hookChanges). Wire-form snapshots omit those.
-     */
-    getRenderDetail: params => {
-      const {
-        nativeTag
-      } = params ?? {};
-      if (nativeTag == null) {
-        return {
-          found: false,
-          reason: "missing nativeTag"
-        };
-      }
-      const render = RenderTracker.getRender(String(nativeTag));
-      if (!render) return {
-        found: false,
-        reason: "unknown nativeTag"
-      };
-      return {
-        found: true,
-        nativeTag,
-        render: jsonSafeRender(render)
-      };
-    },
-    toggle: () => {
-      ensureInitialized();
-      HighlightUpdatesController.toggle();
-    },
-    setEnabled: params => {
-      ensureInitialized();
-      HighlightUpdatesController.setEnabled(params.enabled);
-    },
-    toggleFreeze: () => {
-      HighlightUpdatesController.toggleFreeze();
-    },
-    clearRenderCounts: () => {
-      HighlightUpdatesController.clearRenderCounts();
-    },
-    setSpotlight: params => {
-      HighlightUpdatesController.setSpotlight(params.nativeTag);
-    },
-    // Resolve a component (by testID/nativeID/name/nativeTag) to a fresh
-    // on-screen rectangle — best-effort scrolling it into view first — so the
-    // desktop can crop a simulator screenshot to exactly that component. The
-    // returned value (rect + scale + screen) flows back as the action result.
-    locateComponent: params => {
-      ensureInitialized();
-      return HighlightUpdatesController.locateComponent(params ?? {});
-    },
-    // Track + measure components WITHOUT drawing the highlight boxes, so the
-    // desktop screenshot tool can locate components with no on-device overlay.
-    setSilentTracking: params => {
-      ensureInitialized();
-      HighlightUpdatesController.setSilentTracking(params.enabled ?? false);
-    },
-    // Walk the live fiber tree and return the current screen's meaningful /
-    // interactive elements, each with normalized tap coordinates. Powers the
-    // MCP `describe_screen` reader — no screenshot, no silent-tracking needed.
-    describeScreen: () => describeScreen(),
-    // Tap an element purely in JS: resolve it (by nativeTag / testID / query),
-    // find the nearest onPress up its fiber chain, and invoke it with a
-    // synthetic press event. Powers the MCP `tap_element` action.
-    tapElement: params => tapElement(params ?? {}),
-    // Block until an element is on screen (or gone), so a driver can act on a
-    // screen that has finished loading instead of the skeleton that was there
-    // when `navigate` returned. Same matcher `tapElement` ranks by.
-    waitFor: params => waitFor(params ?? {}),
-    // ── Touch capture: the recording half of tapElement ──────────────────
-    // Observe what a HUMAN taps, named in the same vocabulary tapElement
-    // searches by, so the Scenarios recorder can turn a real session into a
-    // replayable macro. Lives here because this tool already owns the fiber
-    // walk both halves need.
-    startTouchCapture: () => startTouchCapture(),
-    stopTouchCapture: () => {
-      stopTouchCapture();
-      return getTouchCaptureStatus();
-    },
-    clearTouchCapture: () => {
-      clearTouchCapture();
-      return {
-        ok: true
-      };
-    },
-    readTouchCapture: params => readTouchCapture(params?.sinceSeq ?? 0)
-  }
-};
+"use strict";import HighlightUpdatesController from"../highlight-updates/utils/HighlightUpdatesController";import{RenderTracker}from"../highlight-updates/utils/RenderTracker";import{describeScreen,tapElement,waitFor}from"../highlight-updates/utils/screenElements";import{clearTouchCapture,getTouchCaptureStatus,readTouchCapture,startTouchCapture,stopTouchCapture}from"../highlight-updates/utils/touchCapture";import{CommitProfiler}from"../highlight-updates/utils/CommitProfiler";function ensureInitialized(){HighlightUpdatesController.isInitialized()||HighlightUpdatesController.initialize()}function toWireCause(e){if(!e)return;const{hookChanges:t,...r}=e;return r}function toWireRender(e){const{renderHistory:t,lastRenderCause:r,...i}=e;return{...i,lastRenderCause:toWireCause(r),historyCount:t?.length??0}}function jsonSafeRender(e){try{return JSON.stringify(e),e}catch{return{...e,lastRenderCause:toWireCause(e.lastRenderCause),renderHistory:e.renderHistory?.map(e=>({...e,capturedProps:void 0,capturedState:void 0,cause:toWireCause(e.cause)??e.cause}))}}}function beginMeasurement(){return CommitProfiler.isSupported()?(CommitProfiler.startCapture({detail:!0}),{ok:!0}):{ok:!1,reason:"render capture needs a dev build with the React DevTools hook available"}}function endMeasurement(){return{summary:CommitProfiler.stopCapture()}}export const highlightUpdatesSyncAdapter={version:3,getSnapshot:()=>({enabled:HighlightUpdatesController.isEnabled(),frozen:HighlightUpdatesController.getFrozen(),highlightsSuppressed:HighlightUpdatesController.getHighlightsSuppressed(),renders:RenderTracker.getRenders().map(toWireRender),trackerState:RenderTracker.getState()}),subscribe:e=>{const t=HighlightUpdatesController.subscribe(e),r=HighlightUpdatesController.subscribeToFreeze(e),i=RenderTracker.subscribe(e),n=RenderTracker.subscribeToState(e);return()=>{t(),r(),i(),n()}},actions:{beginMeasurement:()=>beginMeasurement(),endMeasurement:()=>endMeasurement(),getRenderDetail:e=>{const{nativeTag:t}=e??{};if(null==t)return{found:!1,reason:"missing nativeTag"};const r=RenderTracker.getRender(String(t));return r?{found:!0,nativeTag:t,render:jsonSafeRender(r)}:{found:!1,reason:"unknown nativeTag"}},toggle:()=>{ensureInitialized(),HighlightUpdatesController.toggle()},setEnabled:e=>{ensureInitialized(),HighlightUpdatesController.setEnabled(e.enabled)},toggleFreeze:()=>{HighlightUpdatesController.toggleFreeze()},clearRenderCounts:()=>{HighlightUpdatesController.clearRenderCounts()},setSpotlight:e=>{HighlightUpdatesController.setSpotlight(e.nativeTag)},locateComponent:e=>(ensureInitialized(),HighlightUpdatesController.locateComponent(e??{})),setSilentTracking:e=>{ensureInitialized(),HighlightUpdatesController.setSilentTracking(e.enabled??!1)},describeScreen:e=>describeScreen(e??{}),tapElement:e=>tapElement(e??{}),waitFor:e=>waitFor(e??{}),startTouchCapture:()=>startTouchCapture(),stopTouchCapture:()=>(stopTouchCapture(),getTouchCaptureStatus()),clearTouchCapture:()=>(clearTouchCapture(),{ok:!0}),readTouchCapture:e=>readTouchCapture(e?.sinceSeq??0)}};

package/lib/typescript/highlight-updates/utils/screenElements.d.ts

@@ -49,6 +49,14 @@ export interface ScreenElement {
         height: number;
     };
 }
+export interface DescribeScreenParams {
+    /**
+     * Also list Buoy's own overlay — the dial, tool sheets, Ask Buoy's chat.
+     * Off by default: the screen being described is the app's, and Buoy's
+     * chrome echoing the caller's own words back is how taps went astray.
+     */
+    includeBuoy?: boolean;
+}
 export interface DescribeScreenResult {
     screen: {
         width: number;
@@ -56,11 +64,15 @@ export interface DescribeScreenResult {
     };
     count: number;
     elements: ScreenElement[];
+    /** Elements under Buoy's own overlay that were left out (pass includeBuoy to see them). */
+    hiddenBuoy?: number;
 }
 export interface TapElementParams {
     nativeTag?: number;
     testID?: string;
     query?: string;
+    /** Let a fuzzy `query` match Buoy's own overlay. Exact nativeTag/testID always may. */
+    includeBuoy?: boolean;
     /** Scroll the target into view first if it's off-screen. Default true. */
     scrollIntoView?: boolean;
     /** Invoke the element's onLongPress instead of onPress. Fails if it has none. */
@@ -88,6 +100,26 @@ export interface TapElementResult {
         /** New value set, for toggle/slider/text controls. */
         value?: number | boolean | string;
     };
+    /**
+     * What the app did after the handler ran. `commits` is the number of React
+     * commits inside the settle window; 0 means the handler fired and nothing
+     * re-rendered — an occluded button, a no-op press, a guard that bailed.
+     */
+    effect?: {
+        commits: number;
+        observedMs: number;
+    };
+    /** Other interactive elements that matched equally well. Non-empty means the choice was a coin toss. */
+    alsoMatched?: Array<{
+        nativeTag: number | null;
+        name: string;
+        testID?: string;
+        text?: string;
+        tap?: {
+            x: number;
+            y: number;
+        };
+    }>;
     candidates?: Array<{
         nativeTag: number | null;
         name: string;
@@ -95,12 +127,14 @@ export interface TapElementResult {
         text?: string;
     }>;
 }
-export declare function describeScreen(): Promise<DescribeScreenResult>;
+export declare function describeScreen(params?: DescribeScreenParams): Promise<DescribeScreenResult>;
 export declare function tapElement(params: TapElementParams): Promise<TapElementResult>;
 export interface WaitForParams {
     nativeTag?: number;
     testID?: string;
     query?: string;
+    /** Let a fuzzy `query` match Buoy's own overlay. Exact nativeTag/testID always may. */
+    includeBuoy?: boolean;
     /** Wait for the element to be GONE instead of present. Default false. */
     gone?: boolean;
     /** Give up after this long. Default 5000ms, capped at 30000. */
@@ -122,6 +156,23 @@ export interface WaitForResult {
         text?: string;
         interactive: boolean;
     };
+    /**
+     * What DID rank for this query on the last scan, when the wait failed.
+     *
+     * A failed wait used to say only "not on screen" — so a caller could not tell
+     * "nothing is called that" from "it is there but scrolled off", and the
+     * cheapest next move looked like another wait with different words. Measured
+     * on a live QA run: five consecutive waits, 99 seconds, against text that was
+     * on screen the whole time. Naming the near misses ends that loop in one
+     * result instead of five calls.
+     */
+    closest?: {
+        name: string;
+        testID?: string;
+        text?: string;
+        /** False means it matched but its measured centre is outside the window. */
+        onScreen: boolean;
+    }[];
 }
 /**
  * Block until an element appears (or disappears), then report how long it took.

package/lib/typescript/highlight-updates/utils/tapMatch.d.ts

@@ -38,5 +38,16 @@ export declare function isRectCenterOnScreen(rect: {
     width: number;
     height: number;
 } | null, screenW: number, screenH: number): boolean;
+/**
+ * The comparable form of a piece of text.
+ *
+ * "1,450", `1450` and "1,450 Points" are one request as far as a person is
+ * concerned. Measured on a live QA run: waits for BOTH "1,450" and 1450 failed
+ * against a balance that was on screen, because the thousands separator made
+ * every comparison miss. Lowercased, whitespace collapsed, digit-group
+ * separators dropped. A number arrives here as a number often enough that the
+ * coercion is not optional — `.trim()` on one is a crash.
+ */
+export declare function looseText(value: unknown): string;
 export declare function scoreTapMatch(c: TapMatchFields, params: TapMatchQuery): number;
 //# sourceMappingURL=tapMatch.d.ts.map

package/lib/typescript/sync/highlightUpdatesSyncAdapter.d.ts

@@ -58,7 +58,7 @@ export declare const highlightUpdatesSyncAdapter: {
         setSpotlight: (params?: unknown) => void;
         locateComponent: (params?: unknown) => Promise<import("../highlight-updates/utils/HighlightUpdatesController").LocateComponentResult>;
         setSilentTracking: (params?: unknown) => void;
-        describeScreen: () => Promise<import("../highlight-updates/utils/screenElements").DescribeScreenResult>;
+        describeScreen: (params?: unknown) => Promise<import("../highlight-updates/utils/screenElements").DescribeScreenResult>;
         tapElement: (params?: unknown) => Promise<import("../highlight-updates/utils/screenElements").TapElementResult>;
         waitFor: (params?: unknown) => Promise<import("../highlight-updates/utils/screenElements").WaitForResult>;
         startTouchCapture: () => {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@buoy-gg/highlight-updates",
-  "version": "7.0.35",
-  "description": "Render highlighter for React Native — see every render with its cause: mount, state, props, or parent. Part of Buoy devtools.",
+  "version": "7.0.38",
+  "description": "Highlight observed React Native renders and inspect available render diagnostics.",
   "main": "lib/commonjs/index",
   "module": "lib/module/index",
   "types": "lib/typescript/index.d.ts",
@@ -26,14 +26,14 @@
   ],
   "sideEffects": false,
   "dependencies": {
-    "@buoy-gg/shared-ui": "^7.0.35",
-    "@buoy-gg/floating-tools-core": "^7.0.35"
+    "@buoy-gg/shared-ui": "^7.0.38",
+    "@buoy-gg/floating-tools-core": "^7.0.38"
   },
   "peerDependencies": {
-    "@buoy-gg/license": "7.0.35",
+    "@buoy-gg/license": "7.0.38",
     "react": "*",
     "react-native": "*",
-    "@buoy-gg/core": "^7.0.35"
+    "@buoy-gg/core": "^7.0.38"
   },
   "peerDependenciesMeta": {
     "@buoy-gg/core": {
@@ -44,8 +44,8 @@
     "@types/react": "^19.1.0",
     "@types/react-native": "^0.73.0",
     "typescript": "~5.8.3",
-    "@buoy-gg/license": "^7.0.35",
-    "@buoy-gg/core": "^7.0.35"
+    "@buoy-gg/core": "^7.0.38",
+    "@buoy-gg/license": "^7.0.38"
   },
   "react-native-builder-bob": {
     "source": "src",

package/lib/typescript/highlight-updates/HighlightUpdatesOverlay.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"HighlightUpdatesOverlay.d.ts","sourceRoot":"","sources":["../../../src/highlight-updates/HighlightUpdatesOverlay.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,KAMN,MAAM,OAAO,CAAC;AA2Bf,UAAU,4BAA4B;IACpC;;;OAGG;IACH,YAAY,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;CAC5C;AAED,wBAAgB,uBAAuB,CAAC,EACtC,YAAY,GACb,GAAE,4BAAiC,GAAG,KAAK,CAAC,YAAY,GAAG,IAAI,CAwP/D;AA2DD,eAAe,uBAAuB,CAAC"}