@buoy-gg/images 7.0.41 → 7.0.43

package/lib/module/components/ImageRow.js

@@ -1,152 +1 @@
-"use strict";
-
-/**
- * ImageRow — one captured image in the list: thumbnail, filename, library +
- * cache badges, load time, and the size verdict.
- *
- * Thumbnails carry the buoy-internal testID so the capture layer skips them —
- * the tool must never appear in its own registry.
- */
-
-import { Image, StyleSheet, Text, TouchableOpacity, View } from "react-native";
-import { macOSColors, night, Pill } from "@buoy-gg/shared-ui";
-import { cacheBadge, formatMs, sizeVerdict, statusColor, uriTail } from "../format";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-export function ImageRow({
-  record,
-  onPress
-}) {
-  const verdict = sizeVerdict(record);
-  const cache = cacheBadge(record);
-  const showThumb = record.sourceKind === "network" || record.sourceKind === "asset" || record.sourceKind === "file";
-  return /*#__PURE__*/_jsxs(TouchableOpacity, {
-    style: styles.row,
-    testID: `buoy-image-row-${record.id}`,
-    onPress: () => onPress(record.id),
-    children: [/*#__PURE__*/_jsxs(View, {
-      style: styles.thumbBox,
-      children: [showThumb && record.uri ? /*#__PURE__*/_jsx(Image, {
-        testID: "buoy-internal-images-thumb",
-        source: {
-          uri: record.uri
-        },
-        style: styles.thumb,
-        resizeMode: "cover"
-      }) : /*#__PURE__*/_jsx(Text, {
-        style: styles.thumbFallback,
-        children: "?"
-      }), /*#__PURE__*/_jsx(View, {
-        style: [styles.statusDot, {
-          backgroundColor: statusColor(record)
-        }]
-      })]
-    }), /*#__PURE__*/_jsxs(View, {
-      style: styles.main,
-      children: [/*#__PURE__*/_jsx(Text, {
-        style: styles.name,
-        numberOfLines: 1,
-        children: uriTail(record.uri)
-      }), /*#__PURE__*/_jsxs(View, {
-        style: styles.metaRow,
-        children: [/*#__PURE__*/_jsx(Pill, {
-          variant: "text",
-          label: record.lib === "web" ? "WEB" : record.lib === "expo" ? "EXPO" : "RN",
-          color: night.color.textTertiary
-        }), /*#__PURE__*/_jsx(Pill, {
-          variant: "text",
-          label: cache.label,
-          color: cache.color
-        }), record.overrideLabel ? /*#__PURE__*/_jsx(Pill, {
-          variant: "text",
-          label: "SIM",
-          color: night.color.warning
-        }) : null, /*#__PURE__*/_jsx(Text, {
-          style: styles.meta,
-          children: formatMs(record.durationMs)
-        }), record.intrinsic ? /*#__PURE__*/_jsxs(Text, {
-          style: styles.meta,
-          children: [record.intrinsic.width, "\xD7", record.intrinsic.height]
-        }) : null]
-      })]
-    }), /*#__PURE__*/_jsx(View, {
-      style: styles.right,
-      children: record.status === "error" ? /*#__PURE__*/_jsx(Text, {
-        style: [styles.verdict, {
-          color: macOSColors.semantic.error
-        }],
-        children: "FAILED"
-      }) : verdict.label ? /*#__PURE__*/_jsx(Text, {
-        style: [styles.verdict, {
-          color: verdict.color
-        }],
-        children: verdict.label
-      }) : null
-    })]
-  });
-}
-const styles = StyleSheet.create({
-  row: {
-    flexDirection: "row",
-    alignItems: "center",
-    paddingHorizontal: 12,
-    paddingVertical: 8,
-    borderBottomWidth: StyleSheet.hairlineWidth,
-    borderBottomColor: night.color.border,
-    gap: 10
-  },
-  thumbBox: {
-    width: 40,
-    height: 40,
-    borderRadius: 6,
-    backgroundColor: night.color.bg,
-    alignItems: "center",
-    justifyContent: "center",
-    overflow: "hidden"
-  },
-  thumb: {
-    width: 40,
-    height: 40
-  },
-  thumbFallback: {
-    color: night.color.textTertiary,
-    fontSize: 16,
-    fontWeight: "700"
-  },
-  statusDot: {
-    position: "absolute",
-    right: 2,
-    bottom: 2,
-    width: 8,
-    height: 8,
-    borderRadius: 4,
-    borderWidth: 1,
-    borderColor: night.color.bg
-  },
-  main: {
-    flex: 1,
-    gap: 2
-  },
-  name: {
-    color: night.color.text,
-    fontSize: 12,
-    fontWeight: "600"
-  },
-  metaRow: {
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 8
-  },
-  meta: {
-    color: night.color.textSecondary,
-    fontSize: 10,
-    fontVariant: ["tabular-nums"]
-  },
-  right: {
-    alignItems: "flex-end"
-  },
-  verdict: {
-    fontSize: 10,
-    fontWeight: "700"
-  }
-});
-//# sourceMappingURL=ImageRow.js.map
+"use strict";import{Image as b,StyleSheet as h,Text as l,TouchableOpacity as d,View as r}from"react-native";import{macOSColors as g,night as o,Pill as s}from"@buoy-gg/shared-ui";import{cacheBadge as f,formatMs as y,sizeVerdict as x,statusColor as w,uriTail as p}from"../format";import{jsx as i,jsxs as n}from"react/jsx-runtime";export function ImageRow({record:t,onPress:m}){const a=x(t);const c=f(t);const u=t.sourceKind==="network"||t.sourceKind==="asset"||t.sourceKind==="file";return n(d,{style:e.row,testID:`buoy-image-row-${t.id}`,onPress:()=>m(t.id),children:[n(r,{style:e.thumbBox,children:[u&&t.uri?i(b,{testID:"buoy-internal-images-thumb",source:{uri:t.uri},style:e.thumb,resizeMode:"cover"}):i(l,{style:e.thumbFallback,children:"?"}),i(r,{style:[e.statusDot,{backgroundColor:w(t)}]})]}),n(r,{style:e.main,children:[i(l,{style:e.name,numberOfLines:1,children:p(t.uri)}),n(r,{style:e.metaRow,children:[i(s,{variant:"text",label:t.lib==="web"?"WEB":t.lib==="expo"?"EXPO":"RN",color:o.color.textTertiary}),i(s,{variant:"text",label:c.label,color:c.color}),t.overrideLabel?i(s,{variant:"text",label:"SIM",color:o.color.warning}):null,i(l,{style:e.meta,children:y(t.durationMs)}),t.intrinsic?n(l,{style:e.meta,children:[t.intrinsic.width,"\xD7",t.intrinsic.height]}):null]})]}),i(r,{style:e.right,children:t.status==="error"?i(l,{style:[e.verdict,{color:g.semantic.error}],children:"FAILED"}):a.label?i(l,{style:[e.verdict,{color:a.color}],children:a.label}):null})]})}const e=h.create({row:{flexDirection:"row",alignItems:"center",paddingHorizontal:12,paddingVertical:8,borderBottomWidth:h.hairlineWidth,borderBottomColor:o.color.border,gap:10},thumbBox:{width:40,height:40,borderRadius:6,backgroundColor:o.color.bg,alignItems:"center",justifyContent:"center",overflow:"hidden"},thumb:{width:40,height:40},thumbFallback:{color:o.color.textTertiary,fontSize:16,fontWeight:"700"},statusDot:{position:"absolute",right:2,bottom:2,width:8,height:8,borderRadius:4,borderWidth:1,borderColor:o.color.bg},main:{flex:1,gap:2},name:{color:o.color.text,fontSize:12,fontWeight:"600"},metaRow:{flexDirection:"row",alignItems:"center",gap:8},meta:{color:o.color.textSecondary,fontSize:10,fontVariant:["tabular-nums"]},right:{alignItems:"flex-end"},verdict:{fontSize:10,fontWeight:"700"}});

package/lib/module/components/ImagesHeader.js

@@ -1,59 +1 @@
-"use strict";
-
-/**
- * ImagesHeader — shared ModalHeader wiring for the Images tool, matching the
- * Console/Network header pattern. List mode shows aggregate stats, the shared
- * ToolbarCopyButton (full registry report) and the shared ToolbarClearButton;
- * detail mode shows back navigation plus the copy button for that record's
- * report. Copy behavior (Pro gating, hint banner, success/error feedback)
- * comes from shared-ui — identical to every other tool.
- */
-
-import { ModalHeader, ToolbarClearButton, ToolbarCopyButton } from "@buoy-gg/shared-ui";
-import { formatBytes } from "../format";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-export function ImagesHeader({
-  stats,
-  detailOpen,
-  detailIndex = -1,
-  detailTotal = 0,
-  onCloseDetail,
-  onClear,
-  getReport,
-  onBack
-}) {
-  if (detailOpen) {
-    const counter = detailIndex >= 0 && detailTotal > 0 ? `${detailIndex + 1} of ${detailTotal}` : undefined;
-    return /*#__PURE__*/_jsxs(ModalHeader, {
-      children: [/*#__PURE__*/_jsx(ModalHeader.Navigation, {
-        onBack: onCloseDetail
-      }), /*#__PURE__*/_jsx(ModalHeader.Content, {
-        title: "Image detail",
-        subtitle: counter
-      }), /*#__PURE__*/_jsx(ModalHeader.Actions, {
-        children: /*#__PURE__*/_jsx(ToolbarCopyButton, {
-          value: getReport
-        })
-      })]
-    });
-  }
-  const subtitleParts = [`${stats.total} images`, `${stats.errors} failed`, `≈${formatBytes(stats.estDecodedBytes)} decoded`];
-  if (stats.estWastedBytes > 0) {
-    subtitleParts.push(`${formatBytes(stats.estWastedBytes)} wasted`);
-  }
-  return /*#__PURE__*/_jsxs(ModalHeader, {
-    children: [onBack ? /*#__PURE__*/_jsx(ModalHeader.Navigation, {
-      onBack: onBack
-    }) : null, /*#__PURE__*/_jsx(ModalHeader.Content, {
-      title: "Images",
-      subtitle: subtitleParts.join(" · ")
-    }), /*#__PURE__*/_jsxs(ModalHeader.Actions, {
-      children: [/*#__PURE__*/_jsx(ToolbarCopyButton, {
-        value: getReport
-      }), /*#__PURE__*/_jsx(ToolbarClearButton, {
-        onPress: onClear
-      })]
-    })]
-  });
-}
-//# sourceMappingURL=ImagesHeader.js.map
+"use strict";import{ModalHeader as e,ToolbarClearButton as $,ToolbarCopyButton as d}from"@buoy-gg/shared-ui";import{formatBytes as u}from"../format";import{jsx as t,jsxs as r}from"react/jsx-runtime";export function ImagesHeader({stats:o,detailOpen:c,detailIndex:s=-1,detailTotal:n=0,onCloseDetail:m,onClear:f,getReport:i,onBack:a}){if(c){const B=s>=0&&n>0?`${s+1} of ${n}`:void 0;return r(e,{children:[t(e.Navigation,{onBack:m}),t(e.Content,{title:"Image detail",subtitle:B}),t(e.Actions,{children:t(d,{value:i})})]})}const l=[`${o.total} images`,`${o.errors} failed`,`\u2248${u(o.estDecodedBytes)} decoded`];if(o.estWastedBytes>0){l.push(`${u(o.estWastedBytes)} wasted`)}return r(e,{children:[a?t(e.Navigation,{onBack:a}):null,t(e.Content,{title:"Images",subtitle:l.join(" \xB7 ")}),r(e.Actions,{children:[t(d,{value:i}),t($,{onPress:f})]})]})}

package/lib/module/components/ImagesIcon.js

@@ -1,12 +1 @@
-"use strict";
-
-/**
- * ImagesIcon — re-exported from the Buoy Icon Format.
- *
- * The artwork lives in shared/icons/images.json and is generated into
- * @buoy-gg/floating-tools-core, so React Native, the desktop dashboard and
- * Flutter all render the same drawing. Edit the JSON, then `pnpm icons`.
- */
-
-export { ImagesIcon, IMAGES_ICON_COLOR } from "@buoy-gg/shared-ui";
-//# sourceMappingURL=ImagesIcon.js.map
+"use strict";export{ImagesIcon,IMAGES_ICON_COLOR}from"@buoy-gg/shared-ui";

package/lib/module/components/ImagesListFooter.js

@@ -1,122 +1 @@
-"use strict";
-
-/**
- * ImagesListFooter — the list screen's action bar: mass simulations applied
- * to EVERY mounted image at once (error / loading / blank), mass hard-reload,
- * flash everything, restore all — plus the global network simulation modes
- * (Normal / Offline / Cold). Styled to match the detail footer.
- */
-
-import { useState, useSyncExternalStore } from "react";
-import { StyleSheet, Text } from "react-native";
-import { FooterButton, FooterCaption, FooterMessage, FooterRow, ToolFooter, night } from "@buoy-gg/shared-ui";
-import { hardReloadAllMounted, subscribeActions } from "../capture/actions";
-import { clearAllOverrides, flashAllMounted, getGlobalModes, setNetworkMode, setOverrideForAllMounted } from "../capture/overrides";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-const NETWORK_MODES = [{
-  key: "normal",
-  label: "Normal"
-}, {
-  key: "offline",
-  label: "Offline"
-}, {
-  key: "cold",
-  label: "Cold"
-}];
-export function ImagesListFooter() {
-  const [message, setMessage] = useState(null);
-  const network = useSyncExternalStore(subscribeActions, () => getGlobalModes().network);
-  const massOverride = (source, label) => {
-    const count = setOverrideForAllMounted(source, label);
-    setMessage(count > 0 ? `${label} on ${count} image${count === 1 ? "" : "s"} — Restore all to undo` : "No mounted images");
-  };
-  return /*#__PURE__*/_jsxs(ToolFooter, {
-    paddingBottom: 10,
-    style: {
-      paddingTop: 8
-    },
-    children: [message ? /*#__PURE__*/_jsx(FooterMessage, {
-      children: message
-    }) : /*#__PURE__*/_jsx(FooterCaption, {
-      children: "MASS ACTIONS \u2014 every image on screen"
-    }), /*#__PURE__*/_jsxs(FooterRow, {
-      children: [/*#__PURE__*/_jsx(MassButton, {
-        label: "Error",
-        onPress: () => massOverride({
-          type: "error"
-        }, "Forced error")
-      }), /*#__PURE__*/_jsx(MassButton, {
-        label: "Loading",
-        onPress: () => massOverride({
-          type: "hang"
-        }, "Forced loading")
-      }), /*#__PURE__*/_jsx(MassButton, {
-        label: "Blank",
-        onPress: () => massOverride({
-          type: "blank"
-        }, "Blanked")
-      }), /*#__PURE__*/_jsx(MassButton, {
-        label: "Reload",
-        onPress: () => {
-          setMessage("…");
-          hardReloadAllMounted().then(r => setMessage(r.message));
-        }
-      }), /*#__PURE__*/_jsx(MassButton, {
-        label: "Find",
-        onPress: () => {
-          const count = flashAllMounted();
-          setMessage(`Flashing ${count} image${count === 1 ? "" : "s"} (2.5s)`);
-        }
-      }), /*#__PURE__*/_jsx(MassButton, {
-        label: "Restore",
-        accent: true,
-        onPress: () => {
-          const count = clearAllOverrides();
-          setMessage(count > 0 ? `Restored ${count} image${count === 1 ? "" : "s"}` : "No overrides active");
-        }
-      })]
-    }), /*#__PURE__*/_jsxs(FooterRow, {
-      children: [/*#__PURE__*/_jsx(Text, {
-        style: styles.netLabel,
-        children: "NET"
-      }), NETWORK_MODES.map(mode => {
-        const active = network === mode.key;
-        return /*#__PURE__*/_jsx(FooterButton, {
-          label: mode.label,
-          active: active,
-          style: {
-            paddingVertical: 6
-          },
-          onPress: () => {
-            setNetworkMode(mode.key);
-            // Modes only affect loads that happen AFTER they're set — an
-            // on-screen image keeps its bitmap until something reloads it.
-            setMessage(mode.key === "normal" ? "Network simulation off — tap RELOAD to load normally again" : mode.key === "offline" ? "Offline: network images FAIL (bundled assets still load) — tap RELOAD to apply to on-screen images" : "Cold (bypass caches) — tap RELOAD: everything refetches like first launch");
-          }
-        }, mode.key);
-      })]
-    })]
-  });
-}
-function MassButton({
-  label,
-  onPress,
-  accent
-}) {
-  return /*#__PURE__*/_jsx(FooterButton, {
-    label: label,
-    onPress: onPress,
-    accent: accent
-  });
-}
-const styles = StyleSheet.create({
-  netLabel: {
-    color: night.color.textTertiary,
-    fontSize: 9,
-    fontWeight: "700",
-    letterSpacing: 0.8,
-    alignSelf: "center",
-    marginRight: 2
-  }
-});
-//# sourceMappingURL=ImagesListFooter.js.map
+"use strict";import{useState as m,useSyncExternalStore as u}from"react";import{StyleSheet as f,Text as p}from"react-native";import{FooterButton as d,FooterCaption as y,FooterMessage as b,FooterRow as g,ToolFooter as h,night as k}from"@buoy-gg/shared-ui";import{hardReloadAllMounted as F,subscribeActions as S}from"../capture/actions";import{clearAllOverrides as A,flashAllMounted as O,getGlobalModes as R,setNetworkMode as M,setOverrideForAllMounted as v}from"../capture/overrides";import{jsx as o,jsxs as c}from"react/jsx-runtime";const x=[{key:"normal",label:"Normal"},{key:"offline",label:"Offline"},{key:"cold",label:"Cold"}];export function ImagesListFooter(){const[s,t]=m(null);const l=u(S,()=>R().network);const a=(e,n)=>{const i=v(e,n);t(i>0?`${n} on ${i} image${i===1?"":"s"} \u2014 Restore all to undo`:"No mounted images")};return c(h,{paddingBottom:10,style:{paddingTop:8},children:[s?o(b,{children:s}):o(y,{children:"MASS ACTIONS \u2014 every image on screen"}),c(g,{children:[o(r,{label:"Error",onPress:()=>a({type:"error"},"Forced error")}),o(r,{label:"Loading",onPress:()=>a({type:"hang"},"Forced loading")}),o(r,{label:"Blank",onPress:()=>a({type:"blank"},"Blanked")}),o(r,{label:"Reload",onPress:()=>{t("\u2026");F().then(e=>t(e.message))}}),o(r,{label:"Find",onPress:()=>{const e=O();t(`Flashing ${e} image${e===1?"":"s"} (2.5s)`)}}),o(r,{label:"Restore",accent:true,onPress:()=>{const e=A();t(e>0?`Restored ${e} image${e===1?"":"s"}`:"No overrides active")}})]}),c(g,{children:[o(p,{style:E.netLabel,children:"NET"}),x.map(e=>{const n=l===e.key;return o(d,{label:e.label,active:n,style:{paddingVertical:6},onPress:()=>{M(e.key);t(e.key==="normal"?"Network simulation off \u2014 tap RELOAD to load normally again":e.key==="offline"?"Offline: network images FAIL (bundled assets still load) \u2014 tap RELOAD to apply to on-screen images":"Cold (bypass caches) \u2014 tap RELOAD: everything refetches like first launch")}},e.key)})]})]})}function r({label:s,onPress:t,accent:l}){return o(d,{label:s,onPress:t,accent:l})}const E=f.create({netLabel:{color:k.color.textTertiary,fontSize:9,fontWeight:"700",letterSpacing:.8,alignSelf:"center",marginRight:2}});

package/lib/module/components/ImagesModal.js

@@ -1,235 +1 @@
-"use strict";
-
-/**
- * ImagesModal — bottom-sheet wrapper rendered by FloatingDevTools when the
- * Images tool is opened. List of captured images → tap for detail. Also
- * surfaces the capture status so a mis-ordered install is self-diagnosing
- * instead of silently empty.
- */
-
-import { useEffect, useState } from "react";
-import { FlatList, StyleSheet, Text, View } from "react-native";
-import { JsModal, macOSColors, night, windowDragProps, ToolEmptyState } from "@buoy-gg/shared-ui";
-import { getCaptureStatus, installImageCapture } from "../capture/install";
-import { getGlobalModes } from "../capture/overrides";
-import { formatRecordMarkdown, formatRegistryMarkdown } from "../export";
-import { useImageRecords } from "../hooks/useImageRecords";
-import { remoteImagesDispatch } from "../remote";
-import { clearRecords, getRecord, updateRecord } from "../store/imageEventStore";
-import { ImageDetail } from "./ImageDetail";
-import { ImageDetailFooter } from "./ImageDetailFooter";
-import { ImageRow } from "./ImageRow";
-import { ImagesHeader } from "./ImagesHeader";
-import { ImagesListFooter } from "./ImagesListFooter";
-import { InsightsBar } from "./InsightsBar";
-import { computeInsights } from "../store/insights";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-function CaptureNotice() {
-  const status = getCaptureStatus();
-  const notices = [];
-  if (status.rnDecoratorTooLate) {
-    notices.push('RN <Image> instrumentation missed the module-load race — add `import "@buoy-gg/images/register"` as the FIRST import of your entry file.');
-  }
-  if (!status.browserObserverActive && !status.expoAvailable && !status.rnDecoratorActive && !status.rnDecoratorTooLate) {
-    notices.push("Waiting for images… render some <Image> components to populate the list.");
-  }
-  if (notices.length === 0) return null;
-  return /*#__PURE__*/_jsx(View, {
-    style: styles.notice,
-    children: notices.map(n => /*#__PURE__*/_jsx(Text, {
-      style: styles.noticeText,
-      children: n
-    }, n))
-  });
-}
-function EmptyState() {
-  return /*#__PURE__*/_jsx(ToolEmptyState, {
-    testID: "buoy-images-empty"
-    // listening: capture is armed, waiting for the first image load.
-    ,
-    otto: "listening",
-    title: "No images captured yet",
-    message: "Every RN <Image> and expo-image load is recorded here with cache verdicts, timings, and oversize checks."
-  });
-}
-export function ImagesModal({
-  visible,
-  onClose,
-  onBack,
-  onMinimize,
-  persistenceKey,
-  inline = false
-}) {
-  // Safety net: ensures capture is live even without the early register
-  // import (expo-image capture is timing-immune, so this still gets most data).
-  installImageCapture();
-  const {
-    records,
-    stats
-  } = useImageRecords();
-  const [selectedId, setSelectedId] = useState(null);
-  const selected = selectedId != null ? getRecord(selectedId) : undefined;
-
-  // Mirror mode: the synced wire records omit errorHeaders (detail-only data)
-  // — pull them from the device the first time a failed record is opened.
-  const wantHeadersFor = selected?.status === "error" && selected.errorHeaders == null ? selected.id : null;
-  useEffect(() => {
-    const remote = remoteImagesDispatch();
-    if (wantHeadersFor == null || !remote) return;
-    let cancelled = false;
-    remote("getDetail", {
-      id: wantHeadersFor
-    }).then(detail => {
-      if (cancelled) return;
-      const headers = detail?.errorHeaders;
-      // `{}` (not undefined) so a headerless error doesn't refetch forever.
-      updateRecord(wantHeadersFor, {
-        errorHeaders: headers ?? {}
-      });
-    }).catch(() => {});
-    return () => {
-      cancelled = true;
-    };
-  }, [wantHeadersFor]);
-
-  // Stepping is relative to the live list (newest first): previous = newer.
-  const selectedIndex = selected ? records.findIndex(r => r.id === selected.id) : -1;
-  const stepTo = index => {
-    const target = records[index];
-    if (target) setSelectedId(target.id);
-  };
-
-  // Mode-appropriate report: single record in detail, full registry (stats +
-  // insights + table) in the list. The shared ToolbarCopyButton resolves this
-  // lazily on press and handles clipboard + feedback + gating.
-  const getReport = () => selected ? formatRecordMarkdown(selected) : formatRegistryMarkdown(records, stats, computeInsights(records), getCaptureStatus(), getGlobalModes());
-  const headerContent = /*#__PURE__*/_jsx(ImagesHeader, {
-    stats: stats,
-    detailOpen: selected != null,
-    detailIndex: selectedIndex,
-    detailTotal: records.length,
-    onCloseDetail: () => setSelectedId(null),
-    onClear: clearRecords,
-    getReport: getReport,
-    onBack: onBack
-  });
-  const body = selected ? /*#__PURE__*/_jsxs(View, {
-    style: styles.detailContainer,
-    children: [/*#__PURE__*/_jsx(ImageDetail, {
-      record: selected
-    }), /*#__PURE__*/_jsx(ImageDetailFooter, {
-      record: selected,
-      hasPrevious: selectedIndex > 0,
-      hasNext: selectedIndex >= 0 && selectedIndex < records.length - 1,
-      onPrevious: () => stepTo(selectedIndex - 1),
-      onNext: () => stepTo(selectedIndex + 1)
-    }, selected.id)]
-  }) : /*#__PURE__*/_jsxs(View, {
-    style: styles.listContainer,
-    children: [/*#__PURE__*/_jsx(InsightsBar, {
-      insights: computeInsights(records)
-    }), /*#__PURE__*/_jsx(CaptureNotice, {}), /*#__PURE__*/_jsx(FlatList, {
-      data: records,
-      keyExtractor: item => String(item.id),
-      renderItem: ({
-        item
-      }) => /*#__PURE__*/_jsx(ImageRow, {
-        record: item,
-        onPress: setSelectedId
-      }),
-      ListEmptyComponent: /*#__PURE__*/_jsx(EmptyState, {})
-    }), /*#__PURE__*/_jsx(ImagesListFooter, {})]
-  });
-
-  // The ONLY difference between the phone and the desktop dashboard is which
-  // shell the header and body go in. Everything above this is shared.
-  if (inline) {
-    return /*#__PURE__*/_jsxs(View, {
-      style: styles.inlineRoot,
-      children: [/*#__PURE__*/_jsx(View, {
-        style: styles.inlineHeader,
-        ...windowDragProps,
-        children: headerContent
-      }), body]
-    });
-  }
-  return /*#__PURE__*/_jsx(JsModal, {
-    visible: visible,
-    onClose: onClose,
-    onMinimize: onMinimize,
-    persistenceKey: persistenceKey,
-    header: {
-      showToggleButton: true,
-      customContent: headerContent
-    },
-    enablePersistence: true,
-    initialMode: "bottomSheet",
-    disableScrollWrapper: true,
-    children: body
-  });
-}
-
-/**
- * The same Images tool as `ImagesModal`, rendered INLINE for hosts that place
- * tools in a panel rather than a modal (the desktop dashboard). Exists so
- * there is exactly one implementation of the tool's header, list and detail.
- */
-export function ImagesToolView(props = {}) {
-  return /*#__PURE__*/_jsx(ImagesModal, {
-    ...props,
-    inline: true,
-    visible: true,
-    onClose: () => {}
-  });
-}
-const styles = StyleSheet.create({
-  inlineRoot: {
-    flex: 1,
-    minHeight: 0,
-    // Transparent so the desktop workbench's hoisted sky (one field spanning
-    // sidebar + panel) shows through — the shell paints its base beneath it.
-    backgroundColor: "transparent"
-  },
-  inlineHeader: {
-    paddingHorizontal: 12,
-    paddingVertical: 8,
-    borderBottomWidth: 1,
-    borderBottomColor: macOSColors.border.default,
-    // Clear, like Bench — the host's hoisted sky shows through the header.
-    backgroundColor: "transparent"
-  },
-  listContainer: {
-    flex: 1
-  },
-  detailContainer: {
-    flex: 1
-  },
-  notice: {
-    margin: 10,
-    padding: 10,
-    borderRadius: 8,
-    backgroundColor: night.color.warningSoft,
-    gap: 4
-  },
-  noticeText: {
-    color: night.color.warning,
-    fontSize: 11
-  },
-  empty: {
-    alignItems: "center",
-    padding: 32,
-    gap: 8
-  },
-  emptyTitle: {
-    color: night.color.text,
-    fontSize: 13,
-    fontWeight: "600"
-  },
-  emptyText: {
-    color: night.color.textSecondary,
-    fontSize: 11,
-    textAlign: "center",
-    lineHeight: 16
-  }
-});
-//# sourceMappingURL=ImagesModal.js.map
+"use strict";import{useEffect as H,useState as k}from"react";import{FlatList as M,StyleSheet as z,Text as E,View as d}from"react-native";import{JsModal as N,macOSColors as B,night as g,windowDragProps as F,ToolEmptyState as L}from"@buoy-gg/shared-ui";import{getCaptureStatus as b,installImageCapture as P}from"../capture/install";import{getGlobalModes as j}from"../capture/overrides";import{formatRecordMarkdown as A,formatRegistryMarkdown as W}from"../export";import{useImageRecords as O}from"../hooks/useImageRecords";import{remoteImagesDispatch as V}from"../remote";import{clearRecords as _,getRecord as G,updateRecord as J}from"../store/imageEventStore";import{ImageDetail as K}from"./ImageDetail";import{ImageDetailFooter as q}from"./ImageDetailFooter";import{ImageRow as Q}from"./ImageRow";import{ImagesHeader as U}from"./ImagesHeader";import{ImagesListFooter as X}from"./ImagesListFooter";import{InsightsBar as Y}from"./InsightsBar";import{computeInsights as C}from"../store/insights";import{jsx as e,jsxs as u}from"react/jsx-runtime";function Z(){const r=b();const i=[];if(r.rnDecoratorTooLate){i.push('RN <Image> instrumentation missed the module-load race \u2014 add `import "@buoy-gg/images/register"` as the FIRST import of your entry file.')}if(!r.browserObserverActive&&!r.expoAvailable&&!r.rnDecoratorActive&&!r.rnDecoratorTooLate){i.push("Waiting for images\u2026 render some <Image> components to populate the list.")}if(i.length===0)return null;return e(d,{style:s.notice,children:i.map(c=>e(E,{style:s.noticeText,children:c},c))})}function $(){return e(L,{testID:"buoy-images-empty",otto:"listening",title:"No images captured yet",message:"Every RN <Image> and expo-image load is recorded here with cache verdicts, timings, and oversize checks."})}export function ImagesModal({visible:r,onClose:i,onBack:c,onMinimize:S,persistenceKey:R,inline:w=false}){P();const{records:n,stats:f}=O();const[h,p]=k(null);const t=h!=null?G(h):void 0;const m=t?.status==="error"&&t.errorHeaders==null?t.id:null;H(()=>{const o=V();if(m==null||!o)return;let l=false;o("getDetail",{id:m}).then(v=>{if(l)return;const D=v?.errorHeaders;J(m,{errorHeaders:D??{}})}).catch(()=>{});return()=>{l=true}},[m]);const a=t?n.findIndex(o=>o.id===t.id):-1;const y=o=>{const l=n[o];if(l)p(l.id)};const T=()=>t?A(t):W(n,f,C(n),b(),j());const x=e(U,{stats:f,detailOpen:t!=null,detailIndex:a,detailTotal:n.length,onCloseDetail:()=>p(null),onClear:_,getReport:T,onBack:c});const I=t?u(d,{style:s.detailContainer,children:[e(K,{record:t}),e(q,{record:t,hasPrevious:a>0,hasNext:a>=0&&a<n.length-1,onPrevious:()=>y(a-1),onNext:()=>y(a+1)},t.id)]}):u(d,{style:s.listContainer,children:[e(Y,{insights:C(n)}),e(Z,{}),e(M,{data:n,keyExtractor:o=>String(o.id),renderItem:({item:o})=>e(Q,{record:o,onPress:p}),ListEmptyComponent:e($,{})}),e(X,{})]});if(w){return u(d,{style:s.inlineRoot,children:[e(d,{style:s.inlineHeader,...F,children:x}),I]})}return e(N,{visible:r,onClose:i,onMinimize:S,persistenceKey:R,header:{showToggleButton:true,customContent:x},enablePersistence:true,initialMode:"bottomSheet",disableScrollWrapper:true,children:I})}export function ImagesToolView(r={}){return e(ImagesModal,{...r,inline:true,visible:true,onClose:()=>{}})}const s=z.create({inlineRoot:{flex:1,minHeight:0,backgroundColor:"transparent"},inlineHeader:{paddingHorizontal:12,paddingVertical:8,borderBottomWidth:1,borderBottomColor:B.border.default,backgroundColor:"transparent"},listContainer:{flex:1},detailContainer:{flex:1},notice:{margin:10,padding:10,borderRadius:8,backgroundColor:g.color.warningSoft,gap:4},noticeText:{color:g.color.warning,fontSize:11},empty:{alignItems:"center",padding:32,gap:8},emptyTitle:{color:g.color.text,fontSize:13,fontWeight:"600"},emptyText:{color:g.color.textSecondary,fontSize:11,textAlign:"center",lineHeight:16}});

package/lib/module/components/ImagesRoot.js

@@ -1,20 +1 @@
-"use strict";
-
-/**
- * Mount once near the app root to start image capture immediately.
- *
- * NOTE: for full RN-core <Image> coverage prefer the side-effect import
- * `import "@buoy-gg/images/register"` as the first import of your entry file —
- * the RN decorator must be installed before React Native's Image module first
- * evaluates. ImagesRoot alone still captures every expo-image instance
- * (timing-immune) and reports whether the RN hook landed.
- */
-
-import { installImageCapture } from "../capture/install";
-export function ImagesRoot() {
-  // Synchronous on first render — earlier than an effect, though still later
-  // than the register import. Idempotent.
-  installImageCapture();
-  return null;
-}
-//# sourceMappingURL=ImagesRoot.js.map
+"use strict";import{installImageCapture as t}from"../capture/install";export function ImagesRoot(){t();return null}

package/lib/module/components/ImagesRoot.web.js

@@ -1,9 +1 @@
-"use strict";
-
-import { useEffect } from 'react';
-import { startBrowserImageCapture } from '../capture/install.web';
-export function ImagesRoot() {
-  useEffect(startBrowserImageCapture, []);
-  return null;
-}
-//# sourceMappingURL=ImagesRoot.web.js.map
+"use strict";import{useEffect as r}from"react";import{startBrowserImageCapture as t}from"../capture/install.web";export function ImagesRoot(){r(t,[]);return null}