@buoy-gg/images 7.0.40 → 7.0.42

package/README.md

@@ -1,12 +1,16 @@
+<div align="center">
+
 # @buoy-gg/images
 
-[![npm version](https://img.shields.io/npm/v/@buoy-gg/images?style=flat-square&labelColor=1c1c1c&color=10B981)](https://www.npmjs.com/package/@buoy-gg/images) [![npm downloads](https://img.shields.io/npm/dm/@buoy-gg/images?style=flat-square&labelColor=1c1c1c&color=10B981)](https://www.npmjs.com/package/@buoy-gg/images)
+Inspect image loads observed by Buoy's supported image hooks, including timing, dimensions and estimated decoded memory.
+
+<a href="https://buoy.gg/buoy/latest/docs/tools/images"><b>Images guide</b></a> &nbsp;·&nbsp; <a href="https://buoy.gg">buoy.gg</a> &nbsp;·&nbsp; <a href="https://github.com/Buoy-gg/buoy">All tools</a>
 
-Inspect image loads observed by Buoy’s supported image hooks, including timing, dimensions, and estimated decoded memory.
+[![npm version](https://img.shields.io/npm/v/@buoy-gg/images?style=flat-square&labelColor=10302a&color=2a9d78)](https://www.npmjs.com/package/@buoy-gg/images) [![npm downloads](https://img.shields.io/npm/dm/@buoy-gg/images?style=flat-square&labelColor=10302a&color=2a9d78&label=downloads%2Fmonth)](https://www.npmjs.com/package/@buoy-gg/images)
 
-Part of [Buoy](https://github.com/Buoy-gg/buoy). Install the package, complete account setup, and follow the integration steps below.
+<a href="https://buoy.gg/buoy/latest/docs/tools/images"><img src="https://raw.githubusercontent.com/Buoy-gg/buoy/main/.github/readme/tools/images.png" alt="Watch the Images film on buoy.gg" width="640" /></a>
 
-Native image loading can bypass JavaScript network capture. This package instruments supported React Native `Image` and `expo-image` paths to provide image-specific details.
+</div>
 
 ## Install
 
@@ -14,67 +18,10 @@ Native image loading can bypass JavaScript network capture. This package instrum
 npm install @buoy-gg/core @buoy-gg/images
 ```
 
-Then add the register import as the **first line** of your app entry file (`index.js` / `index.ts`):
-
-```ts
-import "@buoy-gg/images/register";
-```
-
-> Why first? RN core's `<Image>` instrumentation uses React Native's official component-decorator hook, which must be installed before the Image module first evaluates. expo-image capture has no such constraint — it works no matter when the tool loads. If you skip the import, the tool tells you what it's missing instead of sitting silently empty.
-
-## Before you start
-
-Use a development build with `@buoy-gg/core` and a Free or Pro Buoy account key. From your app’s directory, sign in:
-
-```bash
-npx --package=@buoy-gg/core buoy login
-```
-
-For Expo, initialize Buoy before rendering the menu:
-
-```tsx
-import { Buoy } from "@buoy-gg/core";
-
-Buoy.init({ licenseKey: process.env.EXPO_PUBLIC_BUOY_KEY });
-```
-
-The login command writes the Expo key to `.env.local`. For React Native CLI, pass the key from your app’s environment configuration; React Native does not load `.env.local` automatically. Mount `FloatingDevTools` inside the same providers as your screens and restart the development server after installation. The [Quick Start](https://buoy.gg/buoy/latest/docs/quick-start) shows the complete root component setup.
-
-## Quick start
-
-```tsx
-import { FloatingDevTools } from "@buoy-gg/core";
-
-export default function App() {
-  return (
-    <>
-      <YourApp />
-      <FloatingDevTools />
-    </>
-  );
-}
-```
-
-The IMAGES tool appears in the menu. Open it and browse image loads observed during the session.
-
-## Check the integration
-
-Load a supported image after the capture hook is installed and inspect the entry. Treat cache results according to the image library’s available signals and decoded memory as an estimate. Native image paths outside those hooks may not appear.
-
-## What you get
-
-- **Live image registry** — observed RN `<Image>` and expo-image loads: thumbnail, source, status, load time, decoded dimensions
-- **Cache verdicts** — memory / disk / network per load (expo-image reports it directly; RN core is classified via `Image.queryCache`)
-- **Oversize auditing** — decoded size vs displayed size × device pixel ratio, Lighthouse-style: green within 10%, red beyond 50%, with estimated wasted decoded memory and the exact size you should serve
-- **Memory accounting** — estimated decoded-bitmap bytes per image and totals across the session (catch ballooning before the OOM)
-- **Failure log** — captured `onError` events with the message, and on iOS the HTTP status code + response headers
-- **Cache actions** — clear expo-image memory/disk caches from the detail view
-- **Upscale detection** — tiny sources stretched into big boxes (blurry images) get flagged too
-
-## Desktop & AI
+Images appears in the menu once installed. Open it to browse the image loads seen during the session.
 
-To connect a React Native app to [Buoy Desktop](https://github.com/Buoy-gg/Buoy-Desktop) or MCP, install `@buoy-gg/external-sync` and follow the [Desktop connection guide](https://buoy.gg/buoy/latest/docs/desktop). Sign in to Desktop separately. [MCP setup](https://buoy.gg/buoy/latest/docs/mcp) also requires a process account and Pro access. Available remote actions depend on the tool and app integration.
+The [Images guide](https://buoy.gg/buoy/latest/docs/tools/images) covers setup, what it captures and its limits. New to Buoy? Start with the [Quick start](https://buoy.gg/buoy/latest/docs/quick-start).
 
-## Account and plan requirements
+---
 
-Use a Free or Pro Buoy account. History limits and paid features vary by tool; see [pricing](https://buoy.gg/pricing). Production access requires Pro where supported. Development-only hooks and actions remain unavailable in release builds.
+<sub>Part of <a href="https://buoy.gg">Buoy</a>, developer tools that live inside your app. Proprietary software. © Buoy LLC. <a href="https://buoy.gg/terms">Terms</a></sub>

package/lib/commonjs/autoCapture.js

@@ -0,0 +1 @@
+"use strict";require("./register");

package/lib/commonjs/autoCapture.web.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});

package/lib/commonjs/capture/actions.js

@@ -1,242 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.dropActionState = dropActionState;
-exports.evictExpoDiskEntry = evictExpoDiskEntry;
-exports.getReloadNonce = getReloadNonce;
-exports.getReloadRequest = getReloadRequest;
-exports.hardReloadAllMounted = hardReloadAllMounted;
-exports.hardReloadRecord = hardReloadRecord;
-exports.registerExpoInstance = registerExpoInstance;
-exports.retryRecord = retryRecord;
-exports.settleReloadRequest = settleReloadRequest;
-exports.subscribeActions = subscribeActions;
-var _remote = require("../remote");
-var _state = require("../state");
-var _overrides = require("./overrides");
-/**
- * Per-image actions: hard reload (bypass cache) and retry.
- *
- * RN core path: the decorator wrapper owns every mounted <Image>'s props, so a
- * reload request re-renders the wrapper with a bumped `key` (native remount →
- * fresh load cycle) and, for cache-busting, `source.cache: 'reload'` injected
- * — VERIFIED supported on BOTH platforms (iOS NSURLRequest policy;
- * Android ReactImageView.kt reads source."cache" → Fresco full-fetch). The
- * override stays applied until the load settles, then reverts lazily on the
- * app's next natural re-render (avoids an extra cache round-trip).
- *
- * expo-image path: the patched class instance exposes the public
- * `reloadAsync()`. Cache-busting first evicts the disk entry (cache path +
- * expo-file-system delete) and clears expo's memory cache (global — no
- * per-entry memory eviction exists), so the reload is a true refetch that
- * rewrites both cache tiers.
- */
-
-// ---------------------------------------------------------------------------
-// RN reload-request bus (consumed by the decorator wrapper)
-// ---------------------------------------------------------------------------
-
-function subscribeActions(listener) {
-  const s = (0, _state.imagesState)();
-  s.actionListeners.add(listener);
-  return () => (0, _state.imagesState)().actionListeners.delete(listener);
-}
-function getReloadRequest(recordId) {
-  if (recordId == null) return undefined;
-  return (0, _state.imagesState)().reloadRequests.get(recordId);
-}
-
-/** Reload nonce for a record (0 = never requested). Snapshot for the wrapper. */
-function getReloadNonce(recordId) {
-  return getReloadRequest(recordId)?.nonce ?? 0;
-}
-function requestRnReload(recordId, bust) {
-  const s = (0, _state.imagesState)();
-  const prev = s.reloadRequests.get(recordId);
-  s.reloadRequests.set(recordId, {
-    nonce: (prev?.nonce ?? 0) + 1,
-    bust
-  });
-  // touchRecord bumps the render version (the wrapper's snapshot) and emits.
-  (0, _overrides.touchRecord)(recordId);
-}
-
-/**
- * Mark a request consumed once its load settles (called from the tracker on
- * load/error). Silent — the wrapper reverts the prop override on the app's
- * next natural re-render instead of forcing an immediate one.
- */
-function settleReloadRequest(recordId) {
-  const s = (0, _state.imagesState)();
-  const req = s.reloadRequests.get(recordId);
-  if (req?.bust) {
-    s.reloadRequests.set(recordId, {
-      nonce: req.nonce,
-      bust: false
-    });
-  }
-}
-function dropActionState(recordId) {
-  const s = (0, _state.imagesState)();
-  s.reloadRequests.delete(recordId);
-  s.expoInstances.delete(recordId);
-  s.overrides.delete(recordId);
-  s.flashUntil.delete(recordId);
-  s.recordVersions.delete(recordId);
-}
-
-// ---------------------------------------------------------------------------
-// expo instance registry (populated by the render patch)
-// ---------------------------------------------------------------------------
-
-function registerExpoInstance(recordId, instance) {
-  if (recordId == null) return;
-  (0, _state.imagesState)().expoInstances.set(recordId, instance);
-}
-function expoImageStatics() {
-  try {
-    return require("expo-image").Image ?? null;
-  } catch {
-    return null;
-  }
-}
-/**
- * expo-file-system, legacy path first (v19+/SDK 54+ moved the function API
- * there) then the main import — same pattern as shared-ui's persistentStorage.
- */
-function loadFileSystem() {
-  try {
-    const mod = require("expo-file-system/legacy");
-    const fs = mod?.default || mod;
-    if (fs?.deleteAsync) return fs;
-  } catch {
-    // try main import
-  }
-  try {
-    const mod = require("expo-file-system");
-    const fs = mod?.default || mod;
-    if (fs?.deleteAsync) return fs;
-  } catch {
-    // not installed
-  }
-  return null;
-}
-
-/**
- * Delete an expo-image disk-cache entry (JS-only: cache path + file delete).
- * Returns true if an entry existed and was deleted.
- */
-async function evictExpoDiskEntry(record) {
-  const statics = expoImageStatics();
-  const fileSystem = loadFileSystem();
-  if (!statics?.getCachePathAsync || !fileSystem?.deleteAsync || !record.uri) return false;
-  try {
-    const path = await statics.getCachePathAsync(record.uri);
-    if (!path) return false;
-    const uri = path.startsWith("file://") ? path : `file://${path}`;
-    await fileSystem.deleteAsync(uri, {
-      idempotent: true
-    });
-    return true;
-  } catch {
-    return false;
-  }
-}
-
-// ---------------------------------------------------------------------------
-// High-level dispatchers (used by the detail view)
-// ---------------------------------------------------------------------------
-
-/** Fresh load attempt for a mounted image (no cache bypass). */
-async function retryRecord(record) {
-  const remote = (0, _remote.remoteImagesDispatch)();
-  if (remote) return (0, _remote.remoteActionResult)(remote("retry", {
-    id: record.id
-  }));
-  if (!record.mounted) {
-    return {
-      ok: false,
-      message: "Instance unmounted — cannot reload"
-    };
-  }
-  if (record.lib === "expo") {
-    const instance = (0, _state.imagesState)().expoInstances.get(record.id);
-    if (!instance?.reloadAsync) {
-      return {
-        ok: false,
-        message: "Live instance not reachable"
-      };
-    }
-    await instance.reloadAsync();
-    return {
-      ok: true,
-      message: "Reload requested"
-    };
-  }
-  requestRnReload(record.id, false);
-  return {
-    ok: true,
-    message: "Remounting image"
-  };
-}
-
-/** Hard-reload every mounted image (mass cache-bust). Returns count started. */
-async function hardReloadAllMounted() {
-  const remote = (0, _remote.remoteImagesDispatch)();
-  if (remote) {
-    return (0, _remote.remoteActionResult)(remote("massAction", {
-      kind: "reload"
-    }));
-  }
-  const {
-    getSnapshot
-  } = require("../store/imageEventStore");
-  let count = 0;
-  for (const record of getSnapshot()) {
-    if (!record.mounted) continue;
-    const result = await hardReloadRecord(record);
-    if (result.ok) count++;
-  }
-  return {
-    ok: count > 0,
-    message: `Hard-reloading ${count} mounted image${count === 1 ? "" : "s"}`
-  };
-}
-
-/** Bypass-cache reload: refetches from network and rewrites the caches. */
-async function hardReloadRecord(record) {
-  const remote = (0, _remote.remoteImagesDispatch)();
-  if (remote) return (0, _remote.remoteActionResult)(remote("hardReload", {
-    id: record.id
-  }));
-  if (!record.mounted) {
-    return {
-      ok: false,
-      message: "Instance unmounted — cannot reload"
-    };
-  }
-  if (record.sourceKind !== "network") {
-    // Local/asset sources have no HTTP cache to bust — plain remount instead.
-    return retryRecord(record);
-  }
-  if (record.lib === "expo") {
-    const evicted = await evictExpoDiskEntry(record);
-    const statics = expoImageStatics();
-    // No per-entry memory eviction exists — global clear is the honest option.
-    await statics?.clearMemoryCache?.().catch?.(() => false);
-    const result = await retryRecord(record);
-    if (!result.ok) return result;
-    return {
-      ok: true,
-      message: evicted ? "Disk entry evicted, memory cache cleared, refetching" : "Memory cache cleared, refetching (no disk entry found)"
-    };
-  }
-  requestRnReload(record.id, true);
-  return {
-    ok: true,
-    message: "Refetching with cache bypassed"
-  };
-}
-//# sourceMappingURL=actions.js.map
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.dropActionState=dropActionState;exports.evictExpoDiskEntry=evictExpoDiskEntry;exports.getReloadNonce=getReloadNonce;exports.getReloadRequest=getReloadRequest;exports.hardReloadAllMounted=hardReloadAllMounted;exports.hardReloadRecord=hardReloadRecord;exports.registerExpoInstance=registerExpoInstance;exports.retryRecord=retryRecord;exports.settleReloadRequest=settleReloadRequest;exports.subscribeActions=subscribeActions;var _nativeImageModules=require("./nativeImageModules");var _remote=require("../remote");var _state=require("../state");var _overrides=require("./overrides");function subscribeActions(e){const t=(0,_state.imagesState)();t.actionListeners.add(e);return()=>(0,_state.imagesState)().actionListeners.delete(e)}function getReloadRequest(e){if(e==null)return void 0;return(0,_state.imagesState)().reloadRequests.get(e)}function getReloadNonce(e){return getReloadRequest(e)?.nonce??0}function requestRnReload(e,t){const s=(0,_state.imagesState)();const n=s.reloadRequests.get(e);s.reloadRequests.set(e,{nonce:(n?.nonce??0)+1,bust:t});(0,_overrides.touchRecord)(e)}function settleReloadRequest(e){const t=(0,_state.imagesState)();const s=t.reloadRequests.get(e);if(s?.bust){t.reloadRequests.set(e,{nonce:s.nonce,bust:false})}}function dropActionState(e){const t=(0,_state.imagesState)();t.reloadRequests.delete(e);t.expoInstances.delete(e);t.overrides.delete(e);t.flashUntil.delete(e);t.recordVersions.delete(e)}function registerExpoInstance(e,t){if(e==null)return;(0,_state.imagesState)().expoInstances.set(e,t)}function expoImageStatics(){try{return(0,_nativeImageModules.loadExpoImage)().Image??null}catch{return null}}function loadFileSystem(){try{const e=(0,_nativeImageModules.loadLegacyFileSystem)();const t=e?.default||e;if(t?.deleteAsync)return t}catch{}try{const e=(0,_nativeImageModules.loadFileSystemModule)();const t=e?.default||e;if(t?.deleteAsync)return t}catch{}return null}async function evictExpoDiskEntry(e){const t=expoImageStatics();const s=loadFileSystem();if(!t?.getCachePathAsync||!s?.deleteAsync||!e.uri)return false;try{const n=await t.getCachePathAsync(e.uri);if(!n)return false;const a=n.startsWith("file://")?n:`file://${n}`;await s.deleteAsync(a,{idempotent:true});return true}catch{return false}}async function retryRecord(e){const t=(0,_remote.remoteImagesDispatch)();if(t)return(0,_remote.remoteActionResult)(t("retry",{id:e.id}));if(!e.mounted){return{ok:false,message:"Instance unmounted \u2014 cannot reload"}}if(e.lib==="expo"){const s=(0,_state.imagesState)().expoInstances.get(e.id);if(!s?.reloadAsync){return{ok:false,message:"Live instance not reachable"}}await s.reloadAsync();return{ok:true,message:"Reload requested"}}requestRnReload(e.id,false);return{ok:true,message:"Remounting image"}}async function hardReloadAllMounted(){const e=(0,_remote.remoteImagesDispatch)();if(e){return(0,_remote.remoteActionResult)(e("massAction",{kind:"reload"}))}const{getSnapshot:t}=require("../store/imageEventStore");let s=0;for(const n of t()){if(!n.mounted)continue;const a=await hardReloadRecord(n);if(a.ok)s++}return{ok:s>0,message:`Hard-reloading ${s} mounted image${s===1?"":"s"}`}}async function hardReloadRecord(e){const t=(0,_remote.remoteImagesDispatch)();if(t)return(0,_remote.remoteActionResult)(t("hardReload",{id:e.id}));if(!e.mounted){return{ok:false,message:"Instance unmounted \u2014 cannot reload"}}if(e.sourceKind!=="network"){return retryRecord(e)}if(e.lib==="expo"){const s=await evictExpoDiskEntry(e);const n=expoImageStatics();await n?.clearMemoryCache?.().catch?.(()=>false);const a=await retryRecord(e);if(!a.ok)return a;return{ok:true,message:s?"Disk entry evicted, memory cache cleared, refetching":"Memory cache cleared, refetching (no disk entry found)"}}requestRnReload(e.id,true);return{ok:true,message:"Refetching with cache bypassed"}}

package/lib/commonjs/capture/install.js

@@ -1,45 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.getCaptureStatus = getCaptureStatus;
-exports.installImageCapture = installImageCapture;
-var _state = require("../state");
-var _installExpoImage = require("./installExpoImage");
-var _installRnImage = require("./installRnImage");
-/**
- * installImageCapture — idempotent entry point for the capture layer.
- *
- * IMPORTANT (timing): the RN-core decorator only takes effect if this runs
- * before anything evaluates the `Image` module from 'react-native'. The
- * recommended integration is `import "@buoy-gg/images/register"` as the FIRST
- * import of the app entry file. The expo-image patch has no such constraint.
- *
- * Idempotency is keyed on the globalThis singleton, so even if this package
- * gets evaluated as two module instances, capture installs exactly once.
- */
-
-function installImageCapture() {
-  const s = (0, _state.imagesState)();
-  // Mirror mode (desktop dashboard): never instrument the dashboard's own UI.
-  if (s.captureDisabled || s.captureInstalled) return;
-  s.captureInstalled = true;
-  (0, _installRnImage.installRnImageInterceptor)();
-  (0, _installExpoImage.installExpoImageInterceptor)();
-}
-function getCaptureStatus() {
-  // Mirror mode: report the synced DEVICE's capture status, not the local probe.
-  const mirrored = (0, _state.imagesState)().mirrorCaptureStatus;
-  if (mirrored) return mirrored;
-  const rn = (0, _installRnImage.rnCaptureStatus)();
-  const expo = (0, _installExpoImage.expoCaptureStatus)();
-  return {
-    installed: (0, _state.imagesState)().captureInstalled,
-    rnDecoratorActive: rn.decoratorActive,
-    rnDecoratorTooLate: rn.tooLate,
-    expoPatched: expo.patched,
-    expoAvailable: expo.available
-  };
-}
-//# sourceMappingURL=install.js.map
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.getCaptureStatus=getCaptureStatus;exports.installImageCapture=installImageCapture;var _state=require("../state");var _installExpoImage=require("./installExpoImage");var _installRnImage=require("./installRnImage");function installImageCapture(){const t=(0,_state.imagesState)();if(t.captureDisabled||t.captureInstalled)return;t.captureInstalled=true;(0,_installRnImage.installRnImageInterceptor)();(0,_installExpoImage.installExpoImageInterceptor)()}function getCaptureStatus(){const t=(0,_state.imagesState)().mirrorCaptureStatus;if(t)return t;const e=(0,_installRnImage.rnCaptureStatus)();const a=(0,_installExpoImage.expoCaptureStatus)();return{installed:(0,_state.imagesState)().captureInstalled,rnDecoratorActive:e.decoratorActive,rnDecoratorTooLate:e.tooLate,expoPatched:a.patched,expoAvailable:a.available}}

package/lib/commonjs/capture/install.web.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.getCaptureStatus=getCaptureStatus;exports.installImageCapture=installImageCapture;exports.startBrowserImageCapture=startBrowserImageCapture;exports.stopBrowserImageCapture=stopBrowserImageCapture;var _state=require("../state");var _imageEventStore=require("../store/imageEventStore");var _overrides=require("./overrides");const tracked=new Map;let detach;let leases=0;const EMPTY_IMAGE="data:image/png;base64,";function apply(e){const l=(0,_imageEventStore.getRecord)(e.id);if(!l)return;const n=(0,_state.imagesState)();const d=(0,_overrides.getOverride)(e.id);const r=(0,_overrides.getGlobalModes)();let t=e.source;if(r.network==="offline"&&l.sourceKind==="network")t=EMPTY_IMAGE;if(d?.source){const c=d.source;if(c.type==="url")t=c.uri;else if(c.type==="error")t=EMPTY_IMAGE;else t=null;if(c.type==="hang")(0,_imageEventStore.updateRecord)(e.id,{status:"loading"})}const s=n.reloadRequests.get(e.id);const o=s&&s.nonce!==e.nonce;if(o){e.nonce=s.nonce;if(s.bust&&t&&/^https?:/.test(new URL(t,document.baseURI).href)){const c=new URL(t,document.baseURI);c.searchParams.set("__buoy_reload",String(Date.now()));t=c.href}e.image.removeAttribute("src");(0,_imageEventStore.updateRecord)(e.id,{status:"loading",startedAt:Date.now(),loadCount:l.loadCount+1})}if(r.network==="cold"&&t&&/^https?:/.test(new URL(t,document.baseURI).href)){if(e.coldSource!==t||!e.coldURL||o){e.coldSource=t;const c=new URL(t,document.baseURI);c.searchParams.set("__buoy_reload",`${Date.now()}-${e.nonce}`);e.coldURL=c.href}t=e.coldURL}else{e.coldSource=void 0;e.coldURL=void 0}e.appliedSource=t;e.appliedSrcset=t!==e.source?null:e.srcset;if(e.appliedSrcset===null)e.image.removeAttribute("srcset");else if(e.image.getAttribute("srcset")!==e.appliedSrcset)e.image.setAttribute("srcset",e.appliedSrcset);if(t===null)e.image.removeAttribute("src");else if(e.image.getAttribute("src")!==t)e.image.setAttribute("src",t);const i=document.createElement("span").style;i.cssText=e.style??"";const a=d?.extraProps?.contentFit??d?.extraProps?.resizeMode;if(typeof a==="string")i.objectFit={stretch:"fill",center:"none"}[a]??a;if(r.blank||d?.source?.type==="blank")i.opacity="0";for(const[c,u]of Object.entries(d?.style??{})){const p=c.replace(/[A-Z]/g,f=>`-${f.toLowerCase()}`);i.setProperty(p,typeof u==="number"&&!["opacity","zIndex","flex","flexGrow","flexShrink"].includes(c)?`${u}px`:String(u))}if((n.flashUntil.get(e.id)??0)>Date.now())i.outline="3px solid #ff453a";e.appliedStyle=i.cssText||null;if(e.image.getAttribute("style")!==e.appliedStyle){if(e.appliedStyle===null)e.image.removeAttribute("style");else e.image.setAttribute("style",e.appliedStyle)}}function track(e){if(tracked.has(e)||e.closest("[data-buoy-root]"))return;const l=e.currentSrc||e.src;if(!l)return;const n=(0,_imageEventStore.createRecord)({lib:"web",uri:l,sourceKind:l.startsWith("data:")?"data":l.startsWith("blob:")?"file":"network",hasAltText:e.hasAttribute("alt")||e.hasAttribute("aria-label")});const d={id:n.id,image:e,source:e.getAttribute("src"),srcset:e.getAttribute("srcset"),style:e.getAttribute("style"),appliedSource:e.getAttribute("src"),appliedSrcset:e.getAttribute("srcset"),appliedStyle:e.getAttribute("style"),nonce:0,dispose(){}};const r=()=>{const i=e.getBoundingClientRect();const a=n.layout;const c=n.status==="loaded"&&a&&(a.width!==i.width||a.height!==i.height);(0,_imageEventStore.updateRecord)(n.id,{layout:{width:i.width,height:i.height},layoutShifts:(n.layoutShifts??0)+(c?1:0)})};const t=()=>{const i=performance.getEntriesByName(e.currentSrc||e.src);const a=i[i.length-1];(0,_imageEventStore.updateRecord)(n.id,{status:"loaded",loadedAt:Date.now(),intrinsic:{width:e.naturalWidth,height:e.naturalHeight},...!(0,_overrides.getOverride)(n.id)?.source&&(0,_overrides.getGlobalModes)().network==="normal"?{uri:e.currentSrc||e.src}:{},durationMs:a?.duration,bytesTotal:a&&a.encodedBodySize>0?a.encodedBodySize:void 0,cacheVerdict:a&&a.transferSize>0?"none":void 0,cacheVerdictSource:a?"event":void 0});r()};const s=()=>(0,_imageEventStore.updateRecord)(n.id,{status:"error",erroredAt:Date.now(),error:"The browser could not load this image."});e.addEventListener("load",t);e.addEventListener("error",s);const o=typeof ResizeObserver==="undefined"?void 0:new ResizeObserver(r);o?.observe(e);d.dispose=()=>{o?.disconnect();e.removeEventListener("load",t);e.removeEventListener("error",s)};tracked.set(e,d);r();(0,_imageEventStore.updateRecord)(n.id,{status:"loading",startedAt:Date.now(),loadCount:1});if(e.complete){if(e.naturalWidth>0)t();else s()}apply(d)}function installImageCapture(){const e=(0,_state.imagesState)();if(typeof document==="undefined"||e.captureDisabled||detach)return;e.captureInstalled=true;const l=()=>{for(const[r,t]of tracked)if(!r.isConnected){t.dispose();tracked.delete(r);(0,_imageEventStore.updateRecord)(t.id,{mounted:false})}document.querySelectorAll("img").forEach(track)};const n=new MutationObserver(r=>{if((0,_state.imagesState)().captureDisabled){stopBrowserImageCapture();return}for(const t of r){const s=t.target;const o=tracked.get(s);if(!o||t.type!=="attributes")continue;if(t.attributeName==="src"&&s.getAttribute("src")!==o.appliedSource||t.attributeName==="srcset"&&s.getAttribute("srcset")!==o.appliedSrcset){o.dispose();tracked.delete(s);(0,_imageEventStore.updateRecord)(o.id,{mounted:false})}else if(t.attributeName==="style"&&s.getAttribute("style")!==o.appliedStyle){o.style=s.getAttribute("style");apply(o)}}l()});n.observe(document.documentElement,{childList:true,subtree:true,attributes:true,attributeFilter:["src","srcset","style","alt"]});const d=()=>{for(const r of tracked.values())apply(r)};e.actionListeners.add(d);detach=()=>{n.disconnect();e.actionListeners.delete(d);for(const r of tracked.values()){r.dispose();for(const[t,s,o]of[["src",r.source,r.appliedSource],["srcset",r.srcset,r.appliedSrcset],["style",r.style,r.appliedStyle]]){if(r.image.getAttribute(t)!==o)continue;if(s===null)r.image.removeAttribute(t);else r.image.setAttribute(t,s)}(0,_imageEventStore.updateRecord)(r.id,{mounted:false})}tracked.clear();e.captureInstalled=false};l()}function stopBrowserImageCapture(){detach?.();detach=void 0}function startBrowserImageCapture(){if(typeof document==="undefined")return()=>{};if(leases++===0)installImageCapture();let e=false;return()=>{if(e)return;e=true;if(--leases===0)stopBrowserImageCapture()}}function getCaptureStatus(){return(0,_state.imagesState)().mirrorCaptureStatus??{installed:!!detach,rnDecoratorActive:false,rnDecoratorTooLate:false,expoPatched:false,expoAvailable:false,browserObserverActive:!!detach}}

package/lib/commonjs/capture/installExpoImage.js

@@ -1,99 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.expoCaptureStatus = expoCaptureStatus;
-exports.installExpoImageInterceptor = installExpoImageInterceptor;
-var _state = require("../state");
-var _actions = require("./actions");
-var _overrides = require("./overrides");
-var _shared = require("./shared");
-/**
- * expo-image interception via class-prototype patch.
- *
- * expo-image's <Image> is a class component (React.PureComponent) whose
- * render() reads `this.props`, so wrapping the prototype's render and swapping
- * `this.props` for an instrumented copy for the duration of the original
- * render is timing-immune (prototype methods are looked up dynamically — no
- * import-order race like the RN core decorator). Props are restored in
- * `finally`, so PureComponent's shouldComponentUpdate still compares the
- * app's real props.
- *
- * Double-patch safety: install flags live on the globalThis singleton AND a
- * marker is stamped on the prototype itself, so even two module instances of
- * this package can't wrap render() twice.
- *
- * expo-image is an optional peer: if it isn't installed, this is a no-op.
- */
-
-const PATCH_MARKER = "__buoyImagesPatched";
-const trackers = new WeakMap();
-function trackerFor(instance) {
-  let tracker = trackers.get(instance);
-  if (!tracker) {
-    tracker = new _shared.ImageInstanceTracker("expo");
-    trackers.set(instance, tracker);
-  }
-  return tracker;
-}
-function installExpoImageInterceptor() {
-  const s = (0, _state.imagesState)();
-  if (s.expoInstalled) return;
-  s.expoInstalled = true;
-  let ImageClass;
-  try {
-    ImageClass = require("expo-image").Image;
-  } catch {
-    s.expoAvailable = false;
-    return; // expo-image not installed in this app
-  }
-  if (!ImageClass?.prototype?.render) {
-    s.expoAvailable = false;
-    return;
-  }
-  s.expoAvailable = true;
-  const proto = ImageClass.prototype;
-  if (proto[PATCH_MARKER]) {
-    s.expoPatched = true;
-    return; // already patched by another module instance of this package
-  }
-  proto[PATCH_MARKER] = true;
-  const originalRender = proto.render;
-  const originalUnmount = proto.componentWillUnmount;
-  proto.render = function buoyImagesRender() {
-    const originalProps = this.props;
-    if ((0, _shared.isInternalImage)(originalProps?.testID)) {
-      return originalRender.call(this);
-    }
-    const tracker = trackerFor(this);
-    tracker.syncSource(originalProps?.source);
-    tracker.noteA11y(Boolean(originalProps?.alt ?? originalProps?.accessibilityLabel));
-    // Keep the action layer pointed at the live instance (reloadAsync etc.).
-    (0, _actions.registerExpoInstance)(tracker.getRecordId(), this);
-    const wrapped = tracker.handlers(originalProps);
-    try {
-      // Simulation layer: global modes + per-record override + locate-flash.
-      this.props = (0, _overrides.applyOverrides)({
-        ...originalProps,
-        ...wrapped
-      }, tracker.getRecordId(), "expo");
-      return originalRender.call(this);
-    } finally {
-      this.props = originalProps;
-    }
-  };
-  proto.componentWillUnmount = function buoyImagesUnmount() {
-    trackers.get(this)?.unmount();
-    originalUnmount?.call(this);
-  };
-  s.expoPatched = true;
-}
-function expoCaptureStatus() {
-  const s = (0, _state.imagesState)();
-  return {
-    available: s.expoAvailable,
-    patched: s.expoPatched
-  };
-}
-//# sourceMappingURL=installExpoImage.js.map
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.expoCaptureStatus=expoCaptureStatus;exports.installExpoImageInterceptor=installExpoImageInterceptor;var _state=require("../state");var _actions=require("./actions");var _overrides=require("./overrides");var _shared=require("./shared");const PATCH_MARKER="__buoyImagesPatched";const trackers=new WeakMap;function trackerFor(e){let t=trackers.get(e);if(!t){t=new _shared.ImageInstanceTracker("expo");trackers.set(e,t)}return t}function installExpoImageInterceptor(){const e=(0,_state.imagesState)();if(e.expoInstalled)return;e.expoInstalled=true;let t;try{t=require("expo-image").Image}catch{e.expoAvailable=false;return}if(!t?.prototype?.render){e.expoAvailable=false;return}e.expoAvailable=true;const a=t.prototype;if(a[PATCH_MARKER]){e.expoPatched=true;return}a[PATCH_MARKER]=true;const n=a.render;const s=a.componentWillUnmount;a.render=function i(){const r=this.props;if((0,_shared.isInternalImage)(r?.testID)){return n.call(this)}const o=trackerFor(this);o.syncSource(r?.source);o.noteA11y(Boolean(r?.alt??r?.accessibilityLabel));(0,_actions.registerExpoInstance)(o.getRecordId(),this);const l=o.handlers(r);try{this.props=(0,_overrides.applyOverrides)({...r,...l},o.getRecordId(),"expo");return n.call(this)}finally{this.props=r}};a.componentWillUnmount=function i(){trackers.get(this)?.unmount();s?.call(this)};e.expoPatched=true}function expoCaptureStatus(){const e=(0,_state.imagesState)();return{available:e.expoAvailable,patched:e.expoPatched}}

package/lib/commonjs/capture/installRnImage.js

@@ -1,128 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.installRnImageInterceptor = installRnImageInterceptor;
-exports.rnCaptureStatus = rnCaptureStatus;
-var React = _interopRequireWildcard(require("react"));
-var _state = require("../state");
-var _actions = require("./actions");
-var _overrides = require("./overrides");
-var _shared = require("./shared");
-var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
-/**
- * RN core <Image> interception via the official injection hook.
- *
- * `unstable_setImageComponentDecorator` wraps EVERY RN <Image> app-wide — but
- * the decorator is latched ONCE, at Image module evaluation
- * (`Image.ios.js` / `Image.android.js` read it at module scope). So install
- * order matters: this must run before anything touches `Image` from
- * 'react-native' — hence the `@buoy-gg/images/register` first-import.
- *
- * Detection strategy: the decorator sets `decoratorInvoked` when RN's Image
- * module applies it. `unstable_registerImageAttachedCallback` is a live Set
- * (never latched), so image mounts are always visible — if mounts happen but
- * the decorator never ran, we were too late and CaptureStatus reports it.
- *
- * All flags live on the globalThis singleton (../state.ts) so a second module
- * instance of this package neither re-installs nor reports a stale status.
- */
-
-/** Wraps one RN Image render with capture instrumentation + reload actions. */
-function useImageCapture(props) {
-  const trackerRef = React.useRef(null);
-  if (trackerRef.current == null) {
-    trackerRef.current = new _shared.ImageInstanceTracker("rn");
-  }
-  const tracker = trackerRef.current;
-  const internal = (0, _shared.isInternalImage)(props.testID);
-  if (!internal) {
-    tracker.syncSource(props.source);
-    tracker.noteA11y(Boolean(props.alt ?? props.accessibilityLabel ?? props["aria-label"]));
-  }
-
-  // Action/override bus: version bumps re-render just this instance (snapshot
-  // is per-record with a global floor, so unrelated actions don't invalidate
-  // other images but global-mode toggles reach everyone).
-  React.useSyncExternalStore(_actions.subscribeActions, () => (0, _overrides.getRenderVersion)(internal ? null : tracker.getRecordId()));
-  React.useEffect(() => {
-    if (internal) return undefined;
-    return () => tracker.unmount();
-  }, [tracker, internal]);
-  if (internal) return {
-    props,
-    reloadKey: 0
-  };
-  const recordId = tracker.getRecordId();
-  const wrapped = tracker.handlers(props);
-  const out = {
-    ...props,
-    ...wrapped
-  };
-
-  // While a bust request is pending (cleared when the load settles), refetch
-  // bypassing caches — VERIFIED both platforms honor source.cache: 'reload'.
-  const request = (0, _actions.getReloadRequest)(recordId);
-  if (request?.bust) {
-    out.source = (0, _overrides.patchSourceCache)(out.source, "reload");
-  }
-  // Simulation layer: global modes + per-record override + locate-flash.
-  (0, _overrides.applyOverrides)(out, recordId, "rn");
-  return {
-    props: out,
-    reloadKey: (0, _actions.getReloadNonce)(recordId)
-  };
-}
-function installRnImageInterceptor() {
-  const s = (0, _state.imagesState)();
-  if (s.rnInstalled) return;
-  s.rnInstalled = true;
-  try {
-    // Deep import: evaluates ONLY the injection module, never Image itself.
-    const injection = require("react-native/Libraries/Image/ImageInjection");
-    const setDecorator = injection.unstable_setImageComponentDecorator;
-    const registerAttached = injection.unstable_registerImageAttachedCallback;
-    if (typeof setDecorator === "function") {
-      setDecorator(BaseImage => {
-        (0, _state.imagesState)().decoratorInvoked = true;
-        const CapturedImage = /*#__PURE__*/React.forwardRef(function BuoyCapturedImage(props, ref) {
-          const {
-            props: instrumented,
-            reloadKey
-          } = useImageCapture(props);
-          // key bump forces a native remount → fresh load cycle (retry).
-          return /*#__PURE__*/(0, _jsxRuntime.jsx)(BaseImage, {
-            ...instrumented,
-            ref: ref
-          }, `buoy-r${reloadKey}`);
-        });
-        return CapturedImage;
-      });
-      s.decoratorRegistered = true;
-    }
-
-    // Live mount signal — works regardless of decorator timing. Used purely
-    // to detect the "decorator registered too late" condition.
-    if (typeof registerAttached === "function") {
-      registerAttached(() => {
-        (0, _state.imagesState)().attachSeen++;
-      });
-    }
-  } catch {
-    // Internal RN path moved (version drift) or non-RN platform — expo-image
-    // capture still works; status will report the decorator as inactive.
-    s.decoratorRegistered = false;
-  }
-}
-function rnCaptureStatus() {
-  const s = (0, _state.imagesState)();
-  return {
-    decoratorRegistered: s.decoratorRegistered,
-    decoratorActive: s.decoratorInvoked,
-    // Mounts observed but our wrapper never rendered → Image latched first.
-    tooLate: s.decoratorRegistered && !s.decoratorInvoked && s.attachSeen > 0
-  };
-}
-//# sourceMappingURL=installRnImage.js.map
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.installRnImageInterceptor=installRnImageInterceptor;exports.rnCaptureStatus=rnCaptureStatus;exports.useImageCapture=useImageCapture;var React=_interopRequireWildcard(require("react"));var _state=require("../state");var _actions=require("./actions");var _overrides=require("./overrides");var _shared=require("./shared");var _jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(e,o){if("function"==typeof WeakMap)var r=new WeakMap,a=new WeakMap;return(_interopRequireWildcard=function(t,i){if(!i&&t&&t.__esModule)return t;var n,c,u={__proto__:null,default:t};if(null===t||"object"!=typeof t&&"function"!=typeof t)return u;if(n=i?a:r){if(n.has(t))return n.get(t);n.set(t,u)}for(const s in t)"default"!==s&&{}.hasOwnProperty.call(t,s)&&((c=(n=Object.defineProperty)&&Object.getOwnPropertyDescriptor(t,s))&&(c.get||c.set)?n(u,s,c):u[s]=t[s]);return u})(e,o)}function useImageCapture(e){const o=React.useRef(null);if(o.current==null){o.current=new _shared.ImageInstanceTracker("rn")}const r=o.current;const a=(0,_shared.isInternalImage)(e.testID);if(!a){r.syncSource(e.source);r.noteA11y(Boolean(e.alt??e.accessibilityLabel??e["aria-label"]))}React.useSyncExternalStore(_actions.subscribeActions,()=>(0,_overrides.getRenderVersion)(a?null:r.getRecordId()));React.useEffect(()=>{if(a)return void 0;return()=>r.unmount()},[r,a]);if(a)return{props:e,reloadKey:0};const t=r.getRecordId();const i=r.handlers(e);const n={...e,...i};const c=(0,_actions.getReloadRequest)(t);if(c?.bust){n.source=(0,_overrides.patchSourceCache)(n.source,"reload")}(0,_overrides.applyOverrides)(n,t,"rn");return{props:n,reloadKey:(0,_actions.getReloadNonce)(t)}}function installRnImageInterceptor(){const e=(0,_state.imagesState)();if(e.rnInstalled)return;e.rnInstalled=true;try{const o=require("react-native/Libraries/Image/ImageInjection");const r=o.unstable_setImageComponentDecorator;const a=o.unstable_registerImageAttachedCallback;if(typeof r==="function"&&!e.decoratorRegistered){r(t=>{(0,_state.imagesState)().decoratorInvoked=true;const i=React.forwardRef(function n(c,u){const{props:s,reloadKey:d}=useImageCapture(c);return(0,_jsxRuntime.jsx)(t,{...s,ref:u},`buoy-r${d}`)});return i});e.decoratorRegistered=true}if(typeof a==="function"){a(()=>{(0,_state.imagesState)().attachSeen++})}}catch{e.decoratorRegistered=false}}function rnCaptureStatus(){const e=(0,_state.imagesState)();return{decoratorRegistered:e.decoratorRegistered,decoratorActive:e.decoratorInvoked,tooLate:e.decoratorRegistered&&!e.decoratorInvoked&&e.attachSeen>0}}

package/lib/commonjs/capture/nativeImageModules.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.loadExpoImage=loadExpoImage;exports.loadFileSystemModule=loadFileSystemModule;exports.loadLegacyFileSystem=loadLegacyFileSystem;function loadExpoImage(){try{return require("expo-image")}catch{return null}}function loadLegacyFileSystem(){try{return require("expo-file-system/legacy")}catch{return null}}function loadFileSystemModule(){try{return require("expo-file-system")}catch{return null}}

package/lib/commonjs/capture/nativeImageModules.web.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.loadExpoImage=loadExpoImage;exports.loadFileSystemModule=loadFileSystemModule;exports.loadLegacyFileSystem=loadLegacyFileSystem;function loadExpoImage(){return null}function loadLegacyFileSystem(){return null}function loadFileSystemModule(){return null}