react-request-trail 1.0.0 → 1.1.0

package/dist/index.cjs

@@ -2,14 +2,10 @@
 
 var react = require('react');
 var jspdf = require('jspdf');
-var html2canvas = require('html2canvas');
+var modernScreenshot = require('modern-screenshot');
 var jsxRuntime = require('react/jsx-runtime');
 
 var _documentCurrentScript = typeof document !== 'undefined' ? document.currentScript : null;
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-var html2canvas__default = /*#__PURE__*/_interopDefault(html2canvas);
-
 // src/components/TrailProvider.tsx
 
 // src/core/TrailStore.ts
@@ -1060,38 +1056,48 @@ async function captureScreenshot(targetElement, options) {
       return null;
     }
     const element = targetElement || document.body;
-    const quality = options?.quality ?? 0.8;
+    const quality = options?.quality ?? 0.92;
     const maxWidth = options?.maxWidth ?? 1400;
     const timeout = options?.timeout ?? 5e3;
-    const canvas = await Promise.race([
-      html2canvas__default.default(element, {
-        useCORS: true,
-        // Cross-origin resimleri dahil et
-        allowTaint: false,
-        // Tainted canvas'ı engelle
+    const format = options?.format ?? "jpeg";
+    const scale = options?.scale ?? Math.min(window.devicePixelRatio || 1, 2);
+    const autoCompress = options?.autoCompress !== false;
+    const elementWidth = element.scrollWidth;
+    let effectiveScale = scale;
+    if (elementWidth * scale > maxWidth * 2) {
+      effectiveScale = maxWidth * 2 / elementWidth;
+    }
+    const capturePromise = (async () => {
+      if (autoCompress || format === "jpeg") {
+        const canvas = await modernScreenshot.domToCanvas(element, {
+          scale: effectiveScale,
+          backgroundColor: "#ffffff",
+          fetch: { requestInit: { credentials: "omit" } }
+        });
+        if (!canvas) return null;
+        const mime = format === "png" ? "image/png" : "image/jpeg";
+        let dataUrl2 = canvas.toDataURL(
+          mime,
+          format === "jpeg" ? quality : void 0
+        );
+        if (autoCompress && dataUrl2.length > 10 * 1024 * 1024) {
+          dataUrl2 = canvas.toDataURL("image/jpeg", 0.5);
+        }
+        return dataUrl2;
+      }
+      return await modernScreenshot.domToDataUrl(element, {
+        scale: effectiveScale,
         backgroundColor: "#ffffff",
-        // Arka plan rengi
-        scale: Math.min(window.devicePixelRatio || 1, 2),
-        // Max 2x çözünürlük
-        logging: false,
-        // Console log'ları kapat
-        imageTimeout: 3e3,
-        // Resim yükleme timeout'u
-        removeContainer: true,
-        // Geçici container'ı temizle
-        width: Math.min(element.scrollWidth, maxWidth),
-        windowWidth: Math.min(element.scrollWidth, maxWidth)
-      }),
+        fetch: { requestInit: { credentials: "omit" } }
+      });
+    })();
+    const dataUrl = await Promise.race([
+      capturePromise,
       new Promise(
         (_, reject) => setTimeout(() => reject(new Error("Screenshot timeout")), timeout)
       )
     ]);
-    if (!canvas) return null;
-    const dataUrl = canvas.toDataURL("image/png", quality);
-    if (dataUrl.length > 10 * 1024 * 1024) {
-      return canvas.toDataURL("image/jpeg", 0.5);
-    }
-    return dataUrl;
+    return dataUrl ?? null;
   } catch (error) {
     console.warn("[react-request-trail] Screenshot yakalama basarisiz:", error);
     return null;