@merittdev/horus-lens 0.1.0 → 0.1.1

package/dist/react.cjs

@@ -29354,6 +29354,11 @@ var ReplayRecorder = class {
         emit: (event, isCheckout) => this.onEmit(event, isCheckout),
         checkoutEveryNms: this.windowMs,
         recordCanvas: false,
+        // Inline same-origin + CORS images as data URIs at snapshot time so the
+        // dashboard replay paints on a different origin (tainted cross-origin
+        // images fall back to their URL, which is fine for public CDNs).
+        inlineImages: true,
+        collectFonts: true,
         // Keep the Lens overlay itself out of every recording.
         blockSelector: `#${LENS_OVERLAY_HOST_ID}`
       });
@@ -29460,7 +29465,7 @@ var ReplayRecorder = class {
     console.warn("[lens] rrweb recording unavailable; replay disabled", err);
   }
 };
-async function captureScreenshot(excludeHost) {
+async function captureScreenshot(excludeHost, crop) {
   if (typeof document === "undefined" || typeof window === "undefined") return null;
   try {
     const viewportPixels = window.innerWidth * window.innerHeight || 1;
@@ -29494,12 +29499,50 @@ async function captureScreenshot(excludeHost) {
       );
       return null;
     }
+    if (crop) {
+      const cropped = await cropBlob(blob2, crop, scale);
+      return cropped ?? blob2;
+    }
     return blob2;
   } catch (err) {
     console.warn("[lens] screenshot capture failed:", err);
     return null;
   }
 }
+async function cropBlob(blob2, crop, scale) {
+  try {
+    if (typeof createImageBitmap !== "function" || typeof document === "undefined") return null;
+    const bitmap = await createImageBitmap(blob2);
+    let sx = Math.round(crop.x * scale);
+    let sy = Math.round(crop.y * scale);
+    let sw = Math.round(crop.width * scale);
+    let sh = Math.round(crop.height * scale);
+    sx = Math.max(0, Math.min(sx, bitmap.width));
+    sy = Math.max(0, Math.min(sy, bitmap.height));
+    sw = Math.min(sw, bitmap.width - sx);
+    sh = Math.min(sh, bitmap.height - sy);
+    if (sw <= 0 || sh <= 0) {
+      bitmap.close?.();
+      return null;
+    }
+    const canvas = document.createElement("canvas");
+    canvas.width = sw;
+    canvas.height = sh;
+    const ctx = canvas.getContext("2d");
+    if (!ctx) {
+      bitmap.close?.();
+      return null;
+    }
+    ctx.drawImage(bitmap, sx, sy, sw, sh, 0, 0, sw, sh);
+    bitmap.close?.();
+    return await new Promise((resolve) => {
+      canvas.toBlob((out) => resolve(out), "image/jpeg", 0.82);
+    });
+  } catch (err) {
+    console.warn("[lens] screenshot crop failed:", err);
+    return null;
+  }
+}
 function parseBrowser(ua) {
   if (!ua) return void 0;
   const checks = [
@@ -29764,7 +29807,7 @@ var LensClient = class {
     const wantErrors = include.errors !== false;
     const wantScreenshot = include.screenshot !== false;
     const wantDom = include.dom !== false;
-    const screenshotPromise = this.screenshotEnabled && wantScreenshot ? captureScreenshot(input2.excludeFromScreenshot) : Promise.resolve(null);
+    const screenshotPromise = this.screenshotEnabled && wantScreenshot ? captureScreenshot(input2.excludeFromScreenshot, input2.screenshotCrop) : Promise.resolve(null);
     const replayEvents = wantReplay ? this.replay?.snapshot() ?? [] : [];
     const errorEntries = this.errorBuffer.drain();
     const consoleTail = this.consoleBuffer.tail(CONSOLE_TAIL_SIZE);
@@ -30000,6 +30043,13 @@ var Annotator = class {
   list() {
     return this.annotations.map((a) => ({ ...a, viewport: { ...a.viewport } }));
   }
+  /**
+   * Live rendered rect elements (fixed-positioned, viewport coords). Exposed so
+   * the overlay can derive a document-space bounding box for screenshot crop.
+   */
+  rects() {
+    return [...this.renderedRects];
+  }
   clear() {
     this.annotations = [];
     for (const rect of this.renderedRects) rect.remove();
@@ -31277,11 +31327,13 @@ var Overlay = class {
   }
   async submit(comment2, include) {
     const annotations = this.annotator.list();
+    const screenshotCrop = this.computeAnnotationCrop();
     const result2 = await this.deps.client.submitReport({
       comment: comment2 || void 0,
       annotations,
       target: this.target ?? void 0,
       excludeFromScreenshot: this.host,
+      screenshotCrop,
       include
     });
     this.target = null;
@@ -31290,6 +31342,35 @@ var Overlay = class {
     this.deps.client.discardRecording();
     return result2;
   }
+  /**
+   * Union the marked rects into a single bounding box in DOCUMENT coordinates,
+   * or `undefined` if nothing is marked (→ full-page screenshot). Each rect is
+   * fixed-positioned, so getBoundingClientRect() gives viewport coords; add the
+   * page scroll offset to convert to document space.
+   */
+  computeAnnotationCrop() {
+    const rects = this.annotator.rects();
+    if (rects.length === 0) return void 0;
+    const scrollX = window.scrollX || window.pageXOffset || 0;
+    const scrollY = window.scrollY || window.pageYOffset || 0;
+    let minX = Infinity;
+    let minY = Infinity;
+    let maxX = -Infinity;
+    let maxY = -Infinity;
+    for (const rect of rects) {
+      const r = rect.getBoundingClientRect();
+      const left = r.left + scrollX;
+      const top = r.top + scrollY;
+      minX = Math.min(minX, left);
+      minY = Math.min(minY, top);
+      maxX = Math.max(maxX, left + r.width);
+      maxY = Math.max(maxY, top + r.height);
+    }
+    const width = maxX - minX;
+    const height = maxY - minY;
+    if (!(width > 0) || !(height > 0)) return void 0;
+    return { x: minX, y: minY, width, height };
+  }
   dismiss() {
     this.deps.onDismiss();
     this.destroy();