@diegotsi/flint-react 0.3.3 → 0.3.5

package/dist/index.cjs

@@ -7897,6 +7897,11 @@ function ScreenAnnotator({ zIndex: zIndex2, onCapture, onCancel }) {
       return;
     }
     setPhase("capturing");
+    const sx = window.scrollX ?? window.pageXOffset ?? 0;
+    const sy = window.scrollY ?? window.pageYOffset ?? 0;
+    const dpr = window.devicePixelRatio ?? 1;
+    const vw = window.innerWidth;
+    const vh = window.innerHeight;
     await new Promise(
       (resolve) => requestAnimationFrame(() => requestAnimationFrame(() => resolve()))
     );
@@ -7906,18 +7911,24 @@ function ScreenAnnotator({ zIndex: zIndex2, onCapture, onCancel }) {
         useCORS: true,
         logging: false,
         allowTaint: true,
+        scale: dpr,
+        x: sx,
+        y: sy,
+        width: vw,
+        height: vh,
+        windowWidth: vw,
+        windowHeight: vh,
+        scrollX: -sx,
+        scrollY: -sy,
         ignoreElements: (el) => el === overlayRef.current
       });
       unpatch();
-      const dpr = window.devicePixelRatio ?? 1;
-      const sx = window.scrollX ?? window.pageXOffset ?? 0;
-      const sy = window.scrollY ?? window.pageYOffset ?? 0;
       const ctx = canvas.getContext("2d");
       ctx.fillStyle = "rgba(255,200,0,0.25)";
-      ctx.fillRect((finalRect.x + sx) * dpr, (finalRect.y + sy) * dpr, finalRect.w * dpr, finalRect.h * dpr);
+      ctx.fillRect(finalRect.x * dpr, finalRect.y * dpr, finalRect.w * dpr, finalRect.h * dpr);
       ctx.strokeStyle = "#f97316";
       ctx.lineWidth = 3 * dpr;
-      ctx.strokeRect((finalRect.x + sx) * dpr, (finalRect.y + sy) * dpr, finalRect.w * dpr, finalRect.h * dpr);
+      ctx.strokeRect(finalRect.x * dpr, finalRect.y * dpr, finalRect.w * dpr, finalRect.h * dpr);
       canvas.toBlob((blob) => {
         if (blob) {
           onCapture(new File([blob], "annotation.png", { type: "image/png" }));
@@ -8942,10 +8953,11 @@ var BLOCKED_HOSTS = /* @__PURE__ */ new Set([
   "logs.browser-intake-datadoghq.com",
   "session-replay.browser-intake-datadoghq.com"
 ]);
-function isBlockedUrl(url) {
+function isBlockedUrl(url, extra) {
   try {
     const host = new URL(url, location.href).hostname;
-    return BLOCKED_HOSTS.has(host) || [...BLOCKED_HOSTS].some((b) => host.endsWith("." + b));
+    const all = [...BLOCKED_HOSTS, ...extra];
+    return all.some((b) => host === b || host.endsWith("." + b));
   } catch {
     return false;
   }
@@ -8959,8 +8971,9 @@ function truncateUrl(url) {
     return url.length > 200 ? url.slice(0, 200) + "\u2026" : url;
   }
 }
-function createNetworkCollector() {
+function createNetworkCollector(extraBlockedHosts = []) {
   const entries = [];
+  const blocked = new Set(extraBlockedHosts);
   let origFetch = null;
   let origXHROpen = null;
   let active = false;
@@ -8978,7 +8991,7 @@ function createNetworkCollector() {
         const url = typeof input === "string" ? input : input instanceof URL ? input.href : input.url;
         const startTime = Date.now();
         const res = await origFetch.call(window, input, init);
-        if (!isBlockedUrl(url)) {
+        if (!isBlockedUrl(url, blocked)) {
           push({
             method,
             url: truncateUrl(url),
@@ -8994,7 +9007,7 @@ function createNetworkCollector() {
         const startTime = Date.now();
         const urlStr = typeof url === "string" ? url : url.href;
         this.addEventListener("load", () => {
-          if (!isBlockedUrl(urlStr)) {
+          if (!isBlockedUrl(urlStr, blocked)) {
             push({
               method: method.toUpperCase(),
               url: truncateUrl(urlStr),
@@ -9094,7 +9107,14 @@ function WidgetContent({
     consoleCollector.current.start();
   }
   if (!networkCollector.current) {
-    networkCollector.current = createNetworkCollector();
+    const flintHost = (() => {
+      try {
+        return new URL(serverUrl).hostname;
+      } catch {
+        return "";
+      }
+    })();
+    networkCollector.current = createNetworkCollector(flintHost ? [flintHost] : []);
     networkCollector.current.start();
   }
   (0, import_react4.useEffect)(() => {