@multiplayer-app/session-recorder-react-native 1.0.1-beta.4 → 1.0.1-beta.6

package/src/config/validators.ts

@@ -2,30 +2,53 @@
  * Validation helper functions for configuration objects
  */
 
-export const isValidStringOrRegExp = (value: string | RegExp | undefined, defaultValue: string | RegExp) => {
-  return typeof value === 'string' || value instanceof RegExp ? value : defaultValue
-}
+export const isValidStringOrRegExp = (
+  value: string | RegExp | undefined,
+  defaultValue: string | RegExp
+) => {
+  return typeof value === 'string' || value instanceof RegExp
+    ? value
+    : defaultValue;
+};
 
-export const isValidString = <T extends string>(value: string | undefined | T, defaultValue: string) => {
-  return typeof value === 'string' ? value.trim() : defaultValue
-}
+export const isValidString = <T extends string>(
+  value: string | undefined | T,
+  defaultValue: string
+) => {
+  return typeof value === 'string' ? value.trim() : defaultValue;
+};
 
-export const isValidNumber = (value: number | undefined, defaultValue: number) => {
-  return typeof value === 'number' ? value : defaultValue
-}
+export const isValidNumber = (
+  value: number | undefined,
+  defaultValue: number
+) => {
+  return typeof value === 'number' ? value : defaultValue;
+};
 
-export const isValidBoolean = (value: boolean | undefined, defaultValue: boolean) => {
-  return typeof value === 'boolean' ? value : defaultValue
-}
+export const isValidBoolean = (
+  value: boolean | undefined,
+  defaultValue: boolean
+) => {
+  return typeof value === 'boolean' ? value : defaultValue;
+};
 
-export const isValidArray = <T>(value: ReadonlyArray<T> | undefined, defaultValue: ReadonlyArray<T>): T[] => {
-  return Array.isArray(value) ? [...value] as T[] : [...defaultValue] as T[]
-}
+export const isValidArray = <T>(
+  value: ReadonlyArray<T> | undefined,
+  defaultValue: ReadonlyArray<T>
+): T[] => {
+  return Array.isArray(value)
+    ? ([...value] as T[])
+    : ([...defaultValue] as T[]);
+};
 
-export const isValidEnum = <T>(value: any | T, defaultValue: T, enumValues: T[]): T => {
-  return enumValues.includes(value as T) ? value as T : defaultValue
-}
+export const isValidEnum = <T>(
+  value: any | T,
+  defaultValue: T,
+  enumValues: T[]
+): T => {
+  return enumValues.includes(value as T) ? (value as T) : defaultValue;
+};
 
 export const isValidFunction = (value: any, defaultValue: any) => {
-  return typeof value === 'function' ? value : defaultValue
-}
+  return typeof value === 'function' ? value : defaultValue;
+};

package/src/config/widget.ts

@@ -1,38 +1,47 @@
-import { type SessionRecorderOptions, WidgetButtonPlacement } from "../types"
-import { BASE_CONFIG } from "./defaults"
-import { isValidBoolean, isValidEnum, isValidString } from "./validators"
+import { type SessionRecorderOptions, WidgetButtonPlacement } from '../types';
+import { BASE_CONFIG } from './defaults';
+import { isValidBoolean, isValidEnum, isValidString } from './validators';
 
 export const getWidgetConfig = (config: SessionRecorderOptions['widget']) => {
-  const textOverrides = getTextOverridesConfig(config?.textOverrides, BASE_CONFIG.widget.textOverrides)
+  const textOverrides = getTextOverridesConfig(
+    config?.textOverrides,
+    BASE_CONFIG.widget.textOverrides
+  );
 
   const def = {
     enabled: true,
     button: { visible: true, placement: WidgetButtonPlacement.bottomRight },
     textOverrides,
-  }
+  };
 
-  const placementCandidate = config?.button?.placement || def.button.placement
+  const placementCandidate = config?.button?.placement || def.button.placement;
 
   return {
     textOverrides,
     enabled: isValidBoolean(config && config.enabled, def.enabled),
     button: {
-      visible: isValidBoolean(config && config.button && config.button.visible, def.button.visible),
+      visible: isValidBoolean(
+        config && config.button && config.button.visible,
+        def.button.visible
+      ),
       placement: isValidEnum<WidgetButtonPlacement>(
         placementCandidate,
         def.button.placement,
         Object.values(WidgetButtonPlacement)
       ),
     },
-  }
-}
+  };
+};
 
 const getTextOverridesConfig = (config: any, defaultConfig: any) => {
   if (!config || typeof config !== 'object') {
-    return defaultConfig
+    return defaultConfig;
   }
-  return Object.keys(defaultConfig).reduce((acc, key) => {
-    acc[key] = isValidString(config[key], defaultConfig[key])
-    return acc
-  }, {} as Record<string, unknown>)
-}
+  return Object.keys(defaultConfig).reduce(
+    (acc, key) => {
+      acc[key] = isValidString(config[key], defaultConfig[key]);
+      return acc;
+    },
+    {} as Record<string, unknown>
+  );
+};

package/src/context/SessionRecorderStore.ts

@@ -1,21 +1,22 @@
-import { createStore, type Store } from '../utils/createStore'
-import { SessionType } from '@multiplayer-app/session-recorder-common'
-import { SessionState } from '../types'
+import { createStore, type Store } from '../utils/createStore';
+import { SessionType } from '@multiplayer-app/session-recorder-common';
+import { SessionState } from '../types';
 
 export type SessionRecorderState = {
-  isInitialized: boolean
-  sessionType: SessionType | null
-  sessionState: SessionState | null
-  isWidgetModalVisible: boolean
-  isOnline: boolean
-  error: string | null
-}
+  isInitialized: boolean;
+  sessionType: SessionType | null;
+  sessionState: SessionState | null;
+  isWidgetModalVisible: boolean;
+  isOnline: boolean;
+  error: string | null;
+};
 
-export const sessionRecorderStore: Store<SessionRecorderState> = createStore<SessionRecorderState>({
-  isInitialized: false,
-  sessionType: null,
-  sessionState: null,
-  isWidgetModalVisible: false,
-  isOnline: true,
-  error: null,
-})
+export const sessionRecorderStore: Store<SessionRecorderState> =
+  createStore<SessionRecorderState>({
+    isInitialized: false,
+    sessionType: null,
+    sessionState: null,
+    isWidgetModalVisible: false,
+    isOnline: true,
+    error: null,
+  });

package/src/context/useSessionRecorderStore.ts

@@ -1,27 +1,34 @@
-import { SessionType } from "@multiplayer-app/session-recorder-common"
-import { SessionState } from "../types"
-import { useStoreSelector } from "./useStoreSelector"
-import { type SessionRecorderState, sessionRecorderStore } from "./SessionRecorderStore"
+import { SessionType } from '@multiplayer-app/session-recorder-common';
+import { SessionState } from '../types';
+import { useStoreSelector } from './useStoreSelector';
+import {
+  type SessionRecorderState,
+  sessionRecorderStore,
+} from './SessionRecorderStore';
 
 export function useSessionRecorderStore<TSlice>(
   selector: (s: SessionRecorderState) => TSlice,
   equalityFn?: (a: TSlice, b: TSlice) => boolean
 ): TSlice {
-  return useStoreSelector<SessionRecorderState, TSlice>(sessionRecorderStore, selector, equalityFn)
+  return useStoreSelector<SessionRecorderState, TSlice>(
+    sessionRecorderStore,
+    selector,
+    equalityFn
+  );
 }
 
 export function useSessionRecordingState() {
-  return useSessionRecorderStore<SessionState | null>((s) => s.sessionState)
+  return useSessionRecorderStore<SessionState | null>((s) => s.sessionState);
 }
 
 export function useSessionType() {
-  return useSessionRecorderStore<SessionType | null>((s) => s.sessionType)
+  return useSessionRecorderStore<SessionType | null>((s) => s.sessionType);
 }
 
 export function useIsInitialized() {
-  return useSessionRecorderStore<boolean>((s) => s.isInitialized)
+  return useSessionRecorderStore<boolean>((s) => s.isInitialized);
 }
 
 export function useWidgetModalVisible() {
-  return useSessionRecorderStore<boolean>((s) => s.isWidgetModalVisible)
-}
+  return useSessionRecorderStore<boolean>((s) => s.isWidgetModalVisible);
+}

package/src/context/useStoreSelector.ts

@@ -1,34 +1,36 @@
-import { useEffect, useRef, useState } from 'react'
-import { type Store } from '../utils/createStore'
-import { shallowEqual } from '../utils/shallowEqual'
+import { useEffect, useRef, useState } from 'react';
+import { type Store } from '../utils/createStore';
+import { shallowEqual } from '../utils/shallowEqual';
 
 export function useStoreSelector<TState extends object, TSlice>(
   store: Store<TState>,
   selector: (state: TState) => TSlice,
-  equalityFn: (a: TSlice, b: TSlice) => boolean = Object.is,
+  equalityFn: (a: TSlice, b: TSlice) => boolean = Object.is
 ): TSlice {
-  const latestSelectorRef = useRef(selector)
-  const latestEqualityRef = useRef(equalityFn)
-  latestSelectorRef.current = selector
-  latestEqualityRef.current = equalityFn
+  const latestSelectorRef = useRef(selector);
+  const latestEqualityRef = useRef(equalityFn);
+  latestSelectorRef.current = selector;
+  latestEqualityRef.current = equalityFn;
 
-  const [slice, setSlice] = useState<TSlice>(() => latestSelectorRef.current(store.getState()))
+  const [slice, setSlice] = useState<TSlice>(() =>
+    latestSelectorRef.current(store.getState())
+  );
 
   useEffect(() => {
     function handleChange(nextState: TState, prevState: TState) {
-      const nextSlice = latestSelectorRef.current(nextState)
-      const prevSlice = latestSelectorRef.current(prevState)
+      const nextSlice = latestSelectorRef.current(nextState);
+      const prevSlice = latestSelectorRef.current(prevState);
       if (!latestEqualityRef.current(nextSlice, prevSlice)) {
-        setSlice(nextSlice)
+        setSlice(nextSlice);
       }
     }
-    const unsubscribe = store.subscribe(handleChange)
+    const unsubscribe = store.subscribe(handleChange);
     // Sync once in case changed between render and effect
-    handleChange(store.getState(), store.getState())
-    return unsubscribe
-  }, [store])
+    handleChange(store.getState(), store.getState());
+    return unsubscribe;
+  }, [store]);
 
-  return slice
+  return slice;
 }
 
-export const shallow = shallowEqual
+export const shallow = shallowEqual;

package/src/index.ts

@@ -1,10 +1,10 @@
-import './patch'
-import SessionRecorder from './session-recorder'
-export * from '@multiplayer-app/session-recorder-common'
-export * from './context/SessionRecorderContext'
-export * from './context/useSessionRecorderStore'
+import './patch';
+import SessionRecorder from './session-recorder';
+export * from '@multiplayer-app/session-recorder-common';
+export * from './context/SessionRecorderContext';
+export * from './context/useSessionRecorderStore';
 
 // Export the class for type checking
-export { SessionRecorder }
+export { SessionRecorder };
 // Export the instance as default
-export default SessionRecorder
+export default SessionRecorder;

package/src/native/SessionRecorderNative.ts

@@ -1,164 +1,120 @@
+import { Platform, NativeEventEmitter } from 'react-native';
+import SessionRecorderNative, { type MaskingOptions, type Spec } from '../SessionRecorderNativeSpec';
 
-import { NativeEventEmitter, Platform, TurboModuleRegistry, type TurboModule } from 'react-native';
-
-export interface Spec extends TurboModule {
-  /**
-   * Capture the current screen and apply masking to sensitive elements
-   * @returns Promise that resolves to base64 encoded image
-   */
-  captureAndMask(): Promise<string>
-
-  /**
-   * Capture the current screen and apply masking with custom options
-   * @param options Custom masking options
-   * @returns Promise that resolves to base64 encoded image
-   */
-  captureAndMaskWithOptions(options: MaskingOptions): Promise<string>
-
-  // Gesture recording APIs
-  startGestureRecording(): Promise<void>
-  stopGestureRecording(): Promise<void>
-  isGestureRecordingActive(): Promise<boolean>
-  setGestureCallback(callback: (event: any) => void): void
-}
-
-export interface MaskingOptions {
-  /** Quality of the captured image (0.1 to 1.0, default: 0.3 for smaller file size) */
-  quality?: number
-  /** Scale of the captured image (0.1 to 1.0, default: 1.0) */
-  scale?: number
-  /** Whether to mask text inputs (UITextField, UITextView, React Native text components) */
-  maskTextInputs?: boolean
-  /** Whether to mask images (UIImageView, React Native Image components) */
-  maskImages?: boolean
-  /** Whether to mask buttons (UIButton) */
-  maskButtons?: boolean
-  /** Whether to mask labels (UILabel) */
-  maskLabels?: boolean
-  /** Whether to mask web views (WKWebView) */
-  maskWebViews?: boolean
-  /** Whether to mask sandboxed views (system views that don't belong to current process) */
-  maskSandboxedViews?: boolean
-}
-
-
-export interface SessionRecorderNativeModule {
-  /**
-   * Capture the current screen and apply masking to sensitive elements
-   * @returns Promise that resolves to base64 encoded image
-   */
-  captureAndMask(): Promise<string>
-
-  /**
-   * Capture the current screen and apply masking with custom options
-   * @param options Custom masking options
-   * @returns Promise that resolves to base64 encoded image
-   */
-  captureAndMaskWithOptions(options: MaskingOptions): Promise<string>
-
-  // Gesture recording APIs
-  startGestureRecording(): Promise<void>
-  stopGestureRecording(): Promise<void>
-  isGestureRecordingActive(): Promise<boolean>
-  setGestureCallback(callback: (event: any) => void): void
-}
 
 // Check if we're on web platform
-const isWeb = Platform.OS === 'web'
+const isWeb = Platform.OS === 'web';
 
 // Get the Turbo Module
-let SessionRecorderNative: Spec | null = null
-let eventEmitter: NativeEventEmitter | null = null
-
-if (!isWeb) {
-  try {
-    SessionRecorderNative = TurboModuleRegistry.getEnforcing<Spec>('SessionRecorderNative')
-    eventEmitter = new NativeEventEmitter(SessionRecorderNative as any)
-  } catch (error) {
-    console.warn('Failed to access SessionRecorderNative Turbo Module:', error)
-  }
-}
+let eventEmitter = new NativeEventEmitter(SessionRecorderNative as any);
+
 
 // Validate that the native module is available
 if (!SessionRecorderNative && !isWeb) {
-  console.warn('SessionRecorderNative Turbo Module is not available. Auto-linking may not have completed yet.')
+  console.warn(
+    'SessionRecorderNative Turbo Module is not available. Auto-linking may not have completed yet.'
+  );
 } else if (isWeb) {
-  console.info('SessionRecorderNative: Running on web platform, native module disabled')
+  console.info(
+    'SessionRecorderNative: Running on web platform, native module disabled'
+  );
 }
 
 // Create a safe wrapper that handles web platform
 const SafeSessionRecorderNative: Spec = {
   async captureAndMask(): Promise<string> {
     if (isWeb || !SessionRecorderNative) {
-      throw new Error('SessionRecorderNative is not available on web platform')
+      throw new Error('SessionRecorderNative is not available on web platform');
     }
-    return SessionRecorderNative.captureAndMask()
+    return SessionRecorderNative.captureAndMask();
   },
 
   async captureAndMaskWithOptions(options: MaskingOptions): Promise<string> {
     if (isWeb || !SessionRecorderNative) {
-      throw new Error('SessionRecorderNative is not available on web platform')
+      throw new Error('SessionRecorderNative is not available on web platform');
     }
-    return SessionRecorderNative.captureAndMaskWithOptions(options)
+    return SessionRecorderNative.captureAndMaskWithOptions(options);
   },
 
   async startGestureRecording(): Promise<void> {
     if (isWeb || !SessionRecorderNative) {
-      throw new Error('SessionRecorderNative is not available on web platform')
+      throw new Error('SessionRecorderNative is not available on web platform');
     }
-    return SessionRecorderNative.startGestureRecording()
+    return SessionRecorderNative.startGestureRecording();
   },
 
   async stopGestureRecording(): Promise<void> {
     if (isWeb || !SessionRecorderNative) {
-      throw new Error('SessionRecorderNative is not available on web platform')
+      throw new Error('SessionRecorderNative is not available on web platform');
     }
-    return SessionRecorderNative.stopGestureRecording()
+    return SessionRecorderNative.stopGestureRecording();
   },
 
   async isGestureRecordingActive(): Promise<boolean> {
     if (isWeb || !SessionRecorderNative) {
-      throw new Error('SessionRecorderNative is not available on web platform')
+      throw new Error('SessionRecorderNative is not available on web platform');
     }
-    return SessionRecorderNative.isGestureRecordingActive()
+    return SessionRecorderNative.isGestureRecordingActive();
   },
 
   setGestureCallback(callback: (event: any) => void): void {
     if (isWeb || !SessionRecorderNative) {
-      throw new Error('SessionRecorderNative is not available on web platform')
+      throw new Error('SessionRecorderNative is not available on web platform');
     }
     // Native side will also invoke callback if provided; also subscribe to events here
     try {
-      SessionRecorderNative.setGestureCallback(callback as any)
+      SessionRecorderNative.setGestureCallback(callback as any);
     } catch { }
-    eventEmitter?.removeAllListeners('onGestureDetected')
-    eventEmitter?.addListener('onGestureDetected', callback)
-  }
-}
+    eventEmitter?.removeAllListeners('onGestureDetected');
+    eventEmitter?.addListener('onGestureDetected', callback);
+  },
+
+  recordGesture(gestureType: string, x: number, y: number, target?: string, metadata?: any): void {
+    if (isWeb || !SessionRecorderNative) {
+      throw new Error('SessionRecorderNative is not available on web platform');
+    }
+    SessionRecorderNative.recordGesture(gestureType, x, y, target, metadata);
+  },
+
+  addListener(_eventName: string): void {
+    // Required for RN event emitter contracts
+  },
+
+  removeListeners(_count: number): void {
+    // Required for RN event emitter contracts
+  },
+};
 
 export interface NativeGestureEvent {
-  type: 'tap' | 'pan_start' | 'pan_move' | 'pan_end' | 'long_press' | 'pinch' | 'swipe'
-  timestamp: number
-  x: number
-  y: number
-  target?: string
+  type:
+  | 'tap'
+  | 'pan_start'
+  | 'pan_move'
+  | 'pan_end'
+  | 'long_press'
+  | 'pinch'
+  | 'swipe';
+  timestamp: number;
+  x: number;
+  y: number;
+  target?: string;
   targetInfo?: {
-    identifier: string
-    label?: string
-    role?: string
-    testId?: string
-    text?: string
-  }
+    identifier: string;
+    label?: string;
+    role?: string;
+    testId?: string;
+    text?: string;
+  };
   metadata?: {
-    pressure?: number
-    velocity?: number
-    scale?: number
-    direction?: string
-    distance?: number
-  }
+    pressure?: number;
+    velocity?: number;
+    scale?: number;
+    direction?: string;
+    distance?: number;
+  };
 }
 
-export default SafeSessionRecorderNative
+export default SafeSessionRecorderNative;
 
 // Export event emitter for gesture events to maintain previous API
-export const gestureEventEmitter = eventEmitter
+export const gestureEventEmitter = eventEmitter;

package/src/native/index.ts

@@ -1 +1,5 @@
-export { default as SessionRecorderNative, gestureEventEmitter, type NativeGestureEvent } from './SessionRecorderNative'
+export {
+  default as SessionRecorderNative,
+  gestureEventEmitter,
+  type NativeGestureEvent,
+} from './SessionRecorderNative';