@insitue/sdk 0.1.4 → 0.1.6

package/dist/capture-only.js

@@ -1,7 +1,7 @@
 import {
   mountCaptureOnly
-} from "./chunk-TTH4NBFA.js";
-import "./chunk-65BGOX2M.js";
+} from "./chunk-UWKF2IKW.js";
+import "./chunk-TQEOC7QZ.js";
 export {
   mountCaptureOnly
 };

package/dist/{chunk-65BGOX2M.js → chunk-TQEOC7QZ.js}

@@ -1644,22 +1644,33 @@ async function toCanvas(node, options = {}) {
 var IMAGE_PLACEHOLDER = "data:image/svg+xml;base64," + (typeof btoa !== "undefined" ? btoa(
   '<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"><rect width="32" height="32" fill="#e8e8e8"/><path d="M0 0 L32 32 M32 0 L0 32" stroke="#b0b0b0" stroke-width="1.5"/></svg>'
 ) : "");
-async function preResolveImages() {
+async function preResolveImages(cropRect) {
   const restorations = [];
   const failedImages = /* @__PURE__ */ new Set();
+  const PAD = 64;
   const images = Array.from(
     document.querySelectorAll("img")
-  ).filter(
-    (img) => !img.closest?.("#insitu-root, [data-insitu-layer]")
-  );
-  await Promise.all(
+  ).filter((img) => {
+    if (img.closest?.("#insitu-root, [data-insitu-layer]")) return false;
+    if (!cropRect) return true;
+    const r3 = img.getBoundingClientRect();
+    if (r3.width <= 0 || r3.height <= 0) return false;
+    return r3.right >= cropRect.x - PAD && r3.left <= cropRect.x + cropRect.width + PAD && r3.bottom >= cropRect.y - PAD && r3.top <= cropRect.y + cropRect.height + PAD;
+  });
+  const PER_IMAGE_TIMEOUT_MS = 3e3;
+  await Promise.allSettled(
     images.map(async (img) => {
       const srcToFetch = img.currentSrc || img.src;
       if (!srcToFetch || srcToFetch.startsWith("data:") || srcToFetch.startsWith("blob:")) {
         return;
       }
+      const ac = new AbortController();
+      const timer = setTimeout(() => ac.abort(), PER_IMAGE_TIMEOUT_MS);
       try {
-        const res = await fetch(srcToFetch, { cache: "force-cache" });
+        const res = await fetch(srcToFetch, {
+          cache: "force-cache",
+          signal: ac.signal
+        });
         if (!res.ok) {
           failedImages.add(img);
           return;
@@ -1687,6 +1698,8 @@ async function preResolveImages() {
         }
       } catch {
         failedImages.add(img);
+      } finally {
+        clearTimeout(timer);
       }
     })
   );
@@ -1718,7 +1731,7 @@ async function renderViewportCrop(cropRect, pixelRatio) {
   const bodyBg = getComputedStyle(document.body).backgroundColor;
   const htmlBg = getComputedStyle(document.documentElement).backgroundColor;
   const backgroundColor = bodyBg && bodyBg !== "rgba(0, 0, 0, 0)" && bodyBg !== "transparent" ? bodyBg : htmlBg && htmlBg !== "rgba(0, 0, 0, 0)" && htmlBg !== "transparent" ? htmlBg : "#ffffff";
-  const { restore: restoreImages, failedImages } = await preResolveImages();
+  const { restore: restoreImages, failedImages } = await preResolveImages(cropRect);
   try {
     const fullCanvas = await toCanvas(document.documentElement, {
       pixelRatio,
@@ -1750,11 +1763,59 @@ async function renderViewportCrop(cropRect, pixelRatio) {
     if (looksBlankUniform(ctx, out.width, out.height)) {
       return { dataUrl: null, failedImages };
     }
+    detectUnrenderedImages(ctx, cropRect, out, pixelRatio, failedImages);
     return { dataUrl: out.toDataURL("image/png"), failedImages };
   } finally {
     restoreImages();
   }
 }
+function detectUnrenderedImages(cropCtx, cropRect, cropCanvas, pixelRatio, failedImages) {
+  const imgs = Array.from(
+    document.querySelectorAll("img")
+  ).filter(
+    (img) => !img.closest?.("#insitu-root, [data-insitu-layer]")
+  );
+  for (const img of imgs) {
+    if (failedImages.has(img)) continue;
+    const r3 = img.getBoundingClientRect();
+    if (r3.width < 32 || r3.height < 32) continue;
+    const overlapX = Math.min(r3.right, cropRect.x + cropRect.width) - Math.max(r3.left, cropRect.x);
+    const overlapY = Math.min(r3.bottom, cropRect.y + cropRect.height) - Math.max(r3.top, cropRect.y);
+    if (overlapX <= 0 || overlapY <= 0) continue;
+    const baseX = Math.max(r3.left, cropRect.x);
+    const baseY = Math.max(r3.top, cropRect.y);
+    const samples = /* @__PURE__ */ new Set();
+    try {
+      for (let i3 = 0; i3 < 3; i3++) {
+        for (let j3 = 0; j3 < 3; j3++) {
+          const px2 = baseX + overlapX * (i3 + 0.5) / 3;
+          const py = baseY + overlapY * (j3 + 0.5) / 3;
+          const cx = Math.max(
+            0,
+            Math.min(
+              cropCanvas.width - 1,
+              Math.round((px2 - cropRect.x) * pixelRatio)
+            )
+          );
+          const cy = Math.max(
+            0,
+            Math.min(
+              cropCanvas.height - 1,
+              Math.round((py - cropRect.y) * pixelRatio)
+            )
+          );
+          const d3 = cropCtx.getImageData(cx, cy, 1, 1).data;
+          samples.add(`${d3[0]},${d3[1]},${d3[2]},${d3[3]}`);
+        }
+      }
+    } catch {
+      continue;
+    }
+    if (samples.size === 1) {
+      failedImages.add(img);
+    }
+  }
+}
 function looksBlankUniform(ctx, w3, h3) {
   if (w3 < 4 || h3 < 4) return false;
   const samples = [];
@@ -1994,7 +2055,7 @@ async function buildBundle(sel) {
   const settings = getCaptureSettings();
   let screenshot;
   let screenshotUnavailable;
-  if (el instanceof HTMLElement) {
+  if (el instanceof HTMLElement || el instanceof SVGElement) {
     const context = findContextAncestor(el);
     const cr = context.getBoundingClientRect();
     const cropRect = new DOMRect(
@@ -2084,7 +2145,14 @@ async function buildBundle(sel) {
     computedStyles: el ? curateComputedStyles(el) : {},
     tailwindClasses: el ? extractTailwindClasses(el) : [],
     ...screenshot ? { screenshot } : {},
-    ...screenshotUnavailable ? { screenshotUnavailable } : {},
+    // "Never silent" — if neither screenshot nor screenshotUnavailable
+    // got set above (an unexpected fallthrough), surface that fact
+    // so the widget never renders a blank where a result should be.
+    // The structured diagnostic below tells future-me exactly which
+    // branch ran, surfaced as `__insitu_capture__.bundle` in dev.
+    ...screenshotUnavailable ? { screenshotUnavailable } : !screenshot ? {
+      screenshotUnavailable: el ? `screenshot path didn't set a result (el=${el.tagName.toLowerCase()}; rasterisable=${el instanceof HTMLElement || el instanceof SVGElement})` : "no element selected"
+    } : {},
     viewport: {
       w: window.innerWidth,
       h: window.innerHeight,

package/dist/{chunk-TTH4NBFA.js → chunk-UWKF2IKW.js}

@@ -10,7 +10,7 @@ import {
   retryDisplayMedia,
   stopDisplayMedia,
   y
-} from "./chunk-65BGOX2M.js";
+} from "./chunk-TQEOC7QZ.js";
 
 // src/capture-only.ts
 var DEFAULT_INGEST = "https://www.insitue.com/api/v1/capture";
@@ -260,9 +260,11 @@ function CaptureOnlyApp(props) {
       }) : bundle?.screenshotUnavailable ? k(
         "div",
         {
-          style: `font-size:12px;color:${C.faint};background:${C.surface2};border:1px solid ${C.line};border-radius:10px;padding:10px;margin-bottom:12px`
+          style: `font-size:12px;color:${C.faint};background:${C.surface2};border:1px solid ${C.line};border-radius:10px;padding:10px;margin-bottom:12px;word-break:break-word`
         },
-        "Screenshot unavailable \u2014 sending the rest."
+        // Surface the actual reason inline — helps diagnose
+        // when a capture lands empty without expecting it.
+        `Screenshot unavailable \u2014 ${bundle.screenshotUnavailable}`
       ) : null,
       // Nudge: the screenshot is structurally OK but some content
       // couldn't be embedded (non-CORS img / video / canvas). Offer
@@ -347,7 +349,14 @@ function CaptureOnlyApp(props) {
       {
         style: `display:flex;justify-content:space-between;padding:9px 16px;border-top:1px solid ${C.line};color:${C.faint};font-size:11px`
       },
-      [k("span", {}, "\u{1F512} Secrets scrubbed automatically"), k("span", {}, "InSitue")]
+      [
+        k("span", {}, "\u{1F512} Secrets scrubbed automatically"),
+        k(
+          "span",
+          { title: `@insitue/sdk@${"0.1.6"}` },
+          `InSitue \xB7 v${"0.1.6"}`
+        )
+      ]
     )
   ]);
 }

package/dist/{chunk-7GRJ5SZQ.js → chunk-V2VYHBQC.js}

@@ -15,7 +15,7 @@ import {
   setCaptureSettings,
   stopDisplayMedia,
   y
-} from "./chunk-65BGOX2M.js";
+} from "./chunk-TQEOC7QZ.js";
 
 // src/client.ts
 var CompanionClient = class {

package/dist/index.d.ts

@@ -33,4 +33,10 @@ interface InSitueCaptureProps {
  */
 declare function InSitueCapture({ projectKey, endpoint, onCapture, }: InSitueCaptureProps): null;
 
-export { InSitue, InSitueCapture, type InSitueCaptureProps, type InSitueProps };
+/** Build-time-inlined version of `@insitue/sdk` (from package.json).
+ *  Exposed so the host app can self-verify which SDK build is loaded
+ *  — useful in dev when iterating across publishes. Also surfaced in
+ *  the capture widget footer so a screenshot proves the build. */
+declare const SDK_VERSION: string;
+
+export { InSitue, InSitueCapture, type InSitueCaptureProps, type InSitueProps, SDK_VERSION };

package/dist/index.js

@@ -1,10 +1,10 @@
 import {
   mountCaptureOnly
-} from "./chunk-TTH4NBFA.js";
+} from "./chunk-UWKF2IKW.js";
 import {
   mountInSitue
-} from "./chunk-7GRJ5SZQ.js";
-import "./chunk-65BGOX2M.js";
+} from "./chunk-V2VYHBQC.js";
+import "./chunk-TQEOC7QZ.js";
 
 // src/InSitue.tsx
 import { useEffect } from "react";
@@ -44,9 +44,13 @@ function InSitueCapture({
   }, [projectKey, endpoint, onCapture]);
   return null;
 }
+
+// src/index.ts
+var SDK_VERSION = "0.1.6";
 export {
   InSitue,
   InSitueCapture,
+  SDK_VERSION,
   mountCaptureOnly,
   mountInSitue
 };

package/dist/overlay.js

@@ -1,7 +1,7 @@
 import {
   mountInSitue
-} from "./chunk-7GRJ5SZQ.js";
-import "./chunk-65BGOX2M.js";
+} from "./chunk-V2VYHBQC.js";
+import "./chunk-TQEOC7QZ.js";
 export {
   mountInSitue
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@insitue/sdk",
-  "version": "0.1.4",
+  "version": "0.1.6",
   "description": "InSitue capture SDK — drop one snippet into your deployed app; your users point at a bug, InSitue opens a verified pull request.",
   "license": "MIT",
   "type": "module",