@repliqo/sdk-react-native 0.3.0 → 0.3.2

package/android/src/main/java/com/repliqo/screencapture/ScreenCaptureModule.java

@@ -12,6 +12,7 @@ import com.facebook.react.bridge.Promise;
 import com.facebook.react.bridge.ReactApplicationContext;
 import com.facebook.react.bridge.ReactContextBaseJavaModule;
 import com.facebook.react.bridge.ReactMethod;
+import com.facebook.react.bridge.WritableArray;
 import com.facebook.react.bridge.WritableMap;
 
 /**

package/dist/components/RepliqoScrollView.js

@@ -38,11 +38,11 @@ const react_1 = __importStar(require("react"));
 const react_native_1 = require("react-native");
 const client_1 = require("../core/client");
 /** Minimum scroll delta (px) to trigger a new tile capture. */
-const MIN_DELTA_PX = 50;
+const MIN_DELTA_PX = 20;
 /** Debounce: wait this long after scroll stops before capturing. */
-const DEBOUNCE_MS = 500;
+const DEBOUNCE_MS = 300;
 /** Throttle: minimum time between tile captures. */
-const THROTTLE_MS = 3000;
+const THROTTLE_MS = 500;
 /**
  * Drop-in replacement for React Native's ScrollView that:
  *
@@ -51,7 +51,7 @@ const THROTTLE_MS = 3000;
  *     screen building — the backend composites these into a
  *     full-content image over time from multiple user sessions
  */
-exports.RepliqoScrollView = react_1.default.forwardRef(({ onScroll, onMomentumScrollEnd, onLayout, ...props }, ref) => {
+exports.RepliqoScrollView = react_1.default.forwardRef(({ onScroll, onMomentumScrollEnd, onScrollEndDrag, onLayout, ...props }, ref) => {
     const debounceTimer = (0, react_1.useRef)(null);
     const lastCaptureTime = (0, react_1.useRef)(0);
     const lastCaptureY = (0, react_1.useRef)(-999);
@@ -109,12 +109,17 @@ exports.RepliqoScrollView = react_1.default.forwardRef(({ onScroll, onMomentumSc
         }
         onScroll?.(event);
     }, [onScroll]);
+    const handleScrollEndDrag = (0, react_1.useCallback)((event) => {
+        // User lifted finger — capture immediately
+        doCapture();
+        onScrollEndDrag?.(event);
+    }, [onScrollEndDrag]);
     const handleMomentumEnd = (0, react_1.useCallback)((event) => {
         if (debounceTimer.current) {
             clearTimeout(debounceTimer.current);
             debounceTimer.current = null;
         }
-        setTimeout(doCapture, 200);
+        doCapture();
         onMomentumScrollEnd?.(event);
     }, [onMomentumScrollEnd]);
     const handleLayout = (0, react_1.useCallback)((event) => {
@@ -130,6 +135,6 @@ exports.RepliqoScrollView = react_1.default.forwardRef(({ onScroll, onMomentumSc
         }
         onLayout?.(event);
     }, [onLayout]);
-    return (<react_native_1.ScrollView ref={ref} {...props} onScroll={handleScroll} onMomentumScrollEnd={handleMomentumEnd} onLayout={handleLayout} scrollEventThrottle={props.scrollEventThrottle ?? 16}/>);
+    return (<react_native_1.ScrollView ref={ref} {...props} onScroll={handleScroll} onScrollEndDrag={handleScrollEndDrag} onMomentumScrollEnd={handleMomentumEnd} onLayout={handleLayout} scrollEventThrottle={props.scrollEventThrottle ?? 16}/>);
 });
 exports.RepliqoScrollView.displayName = 'RepliqoScrollView';

package/dist/core/client.js

@@ -284,15 +284,8 @@ class AppAnalytics {
         this.scrollOffsetY = 0;
         this.errorTracker?.setCurrentScreen(screenName);
         this.snapshotCapture?.setCurrentScreen(screenName);
-        // Auto-scan: programmatically scroll the ScrollView and capture
-        // all viewport tiles in ~300ms. Fire-and-forget, invisible to user.
-        if (this.config.enableHeatmapCapture) {
-            setTimeout(() => {
-                if (this.currentScreen !== screenName || !this.sessionId)
-                    return;
-                this.autoScanScreen(screenName);
-            }, 1500); // Wait for screen to fully render
-        }
+        // Tile capture is handled by RepliqoScrollView (on scroll stops,
+        // finger lift, momentum end, and initial layout).
         this.logger.log('Screen entered:', screenName);
     }
     onScreenExit(screenName) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@repliqo/sdk-react-native",
-  "version": "0.3.0",
+  "version": "0.3.2",
   "description": "Session replay & analytics SDK for React Native. Captures screenshots (including modals/alerts), navigation, screen visits, and custom events.",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",

package/src/components/RepliqoScrollView.tsx

@@ -9,11 +9,11 @@ import {
 import { AppAnalytics } from '../core/client';
 
 /** Minimum scroll delta (px) to trigger a new tile capture. */
-const MIN_DELTA_PX = 50;
+const MIN_DELTA_PX = 20;
 /** Debounce: wait this long after scroll stops before capturing. */
-const DEBOUNCE_MS = 500;
+const DEBOUNCE_MS = 300;
 /** Throttle: minimum time between tile captures. */
-const THROTTLE_MS = 3000;
+const THROTTLE_MS = 500;
 
 /**
  * Drop-in replacement for React Native's ScrollView that:
@@ -24,7 +24,7 @@ const THROTTLE_MS = 3000;
  *     full-content image over time from multiple user sessions
  */
 export const RepliqoScrollView = React.forwardRef<ScrollView, ScrollViewProps>(
-  ({ onScroll, onMomentumScrollEnd, onLayout, ...props }, ref) => {
+  ({ onScroll, onMomentumScrollEnd, onScrollEndDrag, onLayout, ...props }, ref) => {
     const debounceTimer = useRef<ReturnType<typeof setTimeout> | null>(null);
     const lastCaptureTime = useRef(0);
     const lastCaptureY = useRef(-999);
@@ -99,13 +99,22 @@ export const RepliqoScrollView = React.forwardRef<ScrollView, ScrollViewProps>(
       [onScroll],
     );
 
+    const handleScrollEndDrag = useCallback(
+      (event: NativeSyntheticEvent<NativeScrollEvent>) => {
+        // User lifted finger — capture immediately
+        doCapture();
+        onScrollEndDrag?.(event);
+      },
+      [onScrollEndDrag],
+    );
+
     const handleMomentumEnd = useCallback(
       (event: NativeSyntheticEvent<NativeScrollEvent>) => {
         if (debounceTimer.current) {
           clearTimeout(debounceTimer.current);
           debounceTimer.current = null;
         }
-        setTimeout(doCapture, 200);
+        doCapture();
         onMomentumScrollEnd?.(event);
       },
       [onMomentumScrollEnd],
@@ -133,6 +142,7 @@ export const RepliqoScrollView = React.forwardRef<ScrollView, ScrollViewProps>(
         ref={ref}
         {...props}
         onScroll={handleScroll}
+        onScrollEndDrag={handleScrollEndDrag}
         onMomentumScrollEnd={handleMomentumEnd}
         onLayout={handleLayout}
         scrollEventThrottle={props.scrollEventThrottle ?? 16}

package/src/core/client.ts

@@ -416,14 +416,8 @@ export class AppAnalytics {
     this.scrollOffsetY = 0;
     this.errorTracker?.setCurrentScreen(screenName);
     this.snapshotCapture?.setCurrentScreen(screenName);
-    // Auto-scan: programmatically scroll the ScrollView and capture
-    // all viewport tiles in ~300ms. Fire-and-forget, invisible to user.
-    if (this.config.enableHeatmapCapture) {
-      setTimeout(() => {
-        if (this.currentScreen !== screenName || !this.sessionId) return;
-        this.autoScanScreen(screenName);
-      }, 1500); // Wait for screen to fully render
-    }
+    // Tile capture is handled by RepliqoScrollView (on scroll stops,
+    // finger lift, momentum end, and initial layout).
 
     this.logger.log('Screen entered:', screenName);
   }