react-native-mparticle 2.7.12 → 2.8.0

package/js/rokt/rokt-layout-view.android.tsx

@@ -0,0 +1,133 @@
+import { StyleSheet } from 'react-native';
+import React, { Component } from 'react';
+import RoktNativeLayoutComponent from '../codegenSpecs/rokt/RoktLayoutNativeComponent';
+
+/**
+ * PUBLIC API: Props that users of RoktLayoutView can set
+ */
+export interface RoktLayoutViewProps {
+  // Placeholder name to use
+  placeholderName: string;
+}
+
+/**
+ * INTERNAL: State managed by the component to handle native events
+ */
+export interface RoktLayoutViewState {
+  height: number;
+  placeholderName: string;
+  marginTop: number;
+  marginRight: number;
+  marginLeft: number;
+  marginBottom: number;
+}
+
+/**
+ * Native event types for type safety
+ */
+interface HeightChangedEvent {
+  nativeEvent: {
+    height: string;
+  };
+}
+
+interface MarginChangedEvent {
+  nativeEvent: {
+    marginTop?: string;
+    marginLeft?: string;
+    marginRight?: string;
+    marginBottom?: string;
+  };
+}
+
+const styles = StyleSheet.create({
+  widget: {
+    flex: 1,
+    backgroundColor: 'transparent',
+  },
+});
+
+/**
+ * RoktEmbeddedView is a wrapper component for the native RoktNativeWidget.
+ * It handles the native events internally and provides a simpler API for React Native apps.
+ *
+ * This component only exposes the placeholderName prop to users, hiding all the internal complexity.
+ */
+export class RoktLayoutView extends Component<
+  RoktLayoutViewProps,
+  RoktLayoutViewState
+> {
+  constructor(props: RoktLayoutViewProps) {
+    super(props);
+    this.state = {
+      height: 0,
+      placeholderName: this.props.placeholderName,
+      marginTop: 0,
+      marginRight: 0,
+      marginLeft: 0,
+      marginBottom: 0,
+    };
+  }
+
+  /**
+   * Handles the height changed event from the native component
+   * This is an internal implementation detail not exposed to users
+   */
+  private handleHeightChanged = (event: HeightChangedEvent) => {
+    if (event && event.nativeEvent && event.nativeEvent.height) {
+      this.setState({ height: parseInt(event.nativeEvent.height) });
+    }
+  };
+
+  /**
+   * Handles the margin changed event from the native component
+   * This is an internal implementation detail not exposed to users
+   */
+  private handleMarginChanged = (event: MarginChangedEvent) => {
+    if (event && event.nativeEvent) {
+      const { marginTop, marginLeft, marginRight, marginBottom } =
+        event.nativeEvent;
+      this.setState({
+        marginTop: parseInt(marginTop || '0'),
+        marginLeft: parseInt(marginLeft || '0'),
+        marginRight: parseInt(marginRight || '0'),
+        marginBottom: parseInt(marginBottom || '0'),
+      });
+    }
+  };
+
+  override render() {
+    try {
+      // Get the placeholderName from props
+      const { placeholderName } = this.props;
+
+      // Return the native component with the props
+      // Cast to React.ComponentType to make it compatible with JSX
+      const RoktComponent =
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        RoktNativeLayoutComponent as React.ComponentType<any>;
+      return (
+        <RoktComponent
+          placeholderName={placeholderName}
+          style={[
+            styles.widget,
+            {
+              height: this.state.height,
+              marginTop: this.state.marginTop,
+              marginLeft: this.state.marginLeft,
+              marginRight: this.state.marginRight,
+              marginBottom: this.state.marginBottom,
+            },
+          ]}
+          onLayoutHeightChanged={this.handleHeightChanged}
+          onLayoutMarginChanged={this.handleMarginChanged}
+        />
+      );
+    } catch (error) {
+      console.error('[ROKT] Error rendering RoktEmbeddedView:', error);
+      return null;
+    }
+  }
+}
+
+export default RoktLayoutView;

package/js/rokt/rokt-layout-view.ios.tsx

@@ -0,0 +1,121 @@
+import {
+  requireNativeComponent,
+  StyleSheet,
+  NativeEventEmitter,
+  NativeModules,
+  ViewProps,
+  NativeModule,
+} from 'react-native';
+import React, { Component } from 'react';
+import { isFabricEnabled } from '../utils/architecture';
+import RoktLayoutNativeComponent from '../codegenSpecs/rokt/RoktLayoutNativeComponent';
+
+const RoktEventManager = NativeModules.RoktEventManager as NativeModule;
+
+export interface HeightChangedEvent extends Event {
+  height: string;
+}
+
+export interface MarginChangedEvent extends Event {
+  marginTop: string;
+  marginRight: string;
+  marginLeft: string;
+  marginBottom: string;
+}
+
+export interface WidgetChangeEvent {
+  selectedPlacement: string;
+  height: string;
+}
+
+export interface RoktLayoutViewProps {
+  placeholderName: string;
+}
+
+export interface RoktLayoutViewState {
+  height: number;
+  placeholderName: string;
+  marginTop: number;
+  marginRight: number;
+  marginLeft: number;
+  marginBottom: number;
+}
+
+// Define the native component props interface
+interface RoktNativeLayoutProps extends ViewProps {
+  placeholderName?: string;
+  onLayoutHeightChanged?: (event: HeightChangedEvent) => void;
+  onLayoutMarginChanged?: (event: MarginChangedEvent) => void;
+}
+
+// Use the appropriate component based on architecture
+const LayoutNativeComponent = (
+  isFabricEnabled
+    ? RoktLayoutNativeComponent
+    : requireNativeComponent<RoktNativeLayoutProps>('RoktLegacyLayout')
+) as any;
+
+const eventManagerEmitter = new NativeEventEmitter(RoktEventManager);
+
+export class RoktLayoutView extends Component<
+  RoktLayoutViewProps,
+  RoktLayoutViewState
+> {
+  subscription = eventManagerEmitter.addListener(
+    'LayoutHeightChanges',
+    (widgetChanges: WidgetChangeEvent) => {
+      if (widgetChanges.selectedPlacement == this.state.placeholderName) {
+        this.setState({ height: parseInt(widgetChanges.height) });
+      }
+    }
+  );
+
+  constructor(props: RoktLayoutViewProps) {
+    super(props);
+
+    this.state = {
+      height: 0,
+      placeholderName: this.props.placeholderName,
+      marginTop: 0,
+      marginRight: 0,
+      marginLeft: 0,
+      marginBottom: 0,
+    };
+  }
+
+  override render() {
+    return (
+      <LayoutNativeComponent
+        style={[styles.widget, { height: this.state.height }]}
+        placeholderName={this.state.placeholderName}
+        onLayoutHeightChanged={(event: HeightChangedEvent) => {
+          if (event.height) {
+            this.setState({ height: parseInt(event.height) });
+          }
+        }}
+        onLayoutMarginChanged={(event: MarginChangedEvent) => {
+          this.setState({
+            marginTop: parseInt(event.marginTop || '0'),
+            marginRight: parseInt(event.marginRight || '0'),
+            marginLeft: parseInt(event.marginLeft || '0'),
+            marginBottom: parseInt(event.marginBottom || '0'),
+          });
+        }}
+      />
+    );
+  }
+
+  override componentWillUnmount() {
+    this.subscription.remove();
+  }
+}
+
+const styles = StyleSheet.create({
+  widget: {
+    flex: 1,
+    backgroundColor: 'transparent',
+    overflow: 'hidden',
+  },
+});
+
+export default RoktLayoutView;

package/js/rokt/rokt-layout-view.tsx

@@ -0,0 +1,15 @@
+import { Platform } from 'react-native';
+
+// Import both implementations
+import { RoktLayoutView as RoktLayoutViewIOS } from './rokt-layout-view.ios';
+import { RoktLayoutView as RoktLayoutViewAndroid } from './rokt-layout-view.android';
+
+// Export types
+export type { RoktLayoutViewProps } from './rokt-layout-view.ios';
+
+// Export the appropriate component based on platform
+export const RoktLayoutView =
+  Platform.OS === 'ios' ? RoktLayoutViewIOS : RoktLayoutViewAndroid;
+
+// Default export
+export default RoktLayoutView;

package/js/rokt/rokt.ts

@@ -0,0 +1,87 @@
+import { NativeModules } from 'react-native';
+import { getNativeModule } from '../utils/architecture';
+import type { Spec as NativeMPRoktInterface } from '../codegenSpecs/rokt/NativeMPRokt';
+
+const MPRokt = getNativeModule<NativeMPRoktInterface>('RNMPRokt');
+
+export abstract class Rokt {
+  /**
+   * Selects placements with a [identifier], [attributes], optional [placeholders], optional [roktConfig], and optional [fontFilePathMap].
+   *
+   * @param {string} identifier - The page identifier for the placement.
+   * @param {Record<string, string>} attributes - Attributes to be associated with the placement.
+   * @param {Record<string, number | null>} [placeholders] - Optional placeholders for dynamic content.
+   * @param {IRoktConfig} [roktConfig] - Optional configuration settings for Rokt.
+   * @param {Record<string, string>} [fontFilesMap] - Optional mapping of font files.
+   * @returns {Promise<void>} A promise that resolves when the placement request is sent.
+   */
+  static async selectPlacements(
+    identifier: string,
+    attributes: Record<string, string>,
+    placeholders?: Record<string, number | null>,
+    roktConfig?: IRoktConfig,
+    fontFilesMap?: Record<string, string>
+  ): Promise<void> {
+    MPRokt.selectPlacements(
+      identifier,
+      attributes,
+      placeholders,
+      roktConfig,
+      fontFilesMap
+    );
+  }
+
+  static async purchaseFinalized(
+    placementId: string,
+    catalogItemId: string,
+    success: boolean
+  ): Promise<void> {
+    MPRokt.purchaseFinalized(placementId, catalogItemId, success);
+  }
+
+  static createRoktConfig(colorMode?: ColorMode, cacheConfig?: CacheConfig) {
+    return new RoktConfig(colorMode ?? 'system', cacheConfig);
+  }
+
+  static createCacheConfig(
+    cacheDurationInSeconds: number,
+    cacheAttributes: Record<string, string>
+  ) {
+    return new CacheConfig(cacheDurationInSeconds, cacheAttributes);
+  }
+}
+
+// Define the interface that matches the native module for cleaner code
+export interface IRoktConfig {
+  readonly colorMode?: ColorMode;
+  readonly cacheConfig?: CacheConfig;
+}
+
+/**
+ * Cache configuration for Rokt SDK
+ */
+export class CacheConfig {
+  /**
+   * @param cacheDurationInSeconds - The duration in seconds for which the Rokt SDK should cache the experience. Default is 90 minutes
+   * @param cacheAttributes - optional attributes to be used as cache key. If null, all the attributes will be used as the cache key
+   */
+  constructor(
+    public readonly cacheDurationInSeconds?: number,
+    public readonly cacheAttributes?: Record<string, string>
+  ) {}
+}
+
+class RoktConfig implements IRoktConfig {
+  public readonly colorMode: ColorMode;
+  public readonly cacheConfig?: CacheConfig;
+
+  constructor(colorMode: ColorMode, cacheConfig?: CacheConfig) {
+    this.colorMode = colorMode;
+    this.cacheConfig = cacheConfig;
+  }
+}
+const { RoktEventManager } = NativeModules;
+
+export { RoktEventManager };
+
+export type ColorMode = 'light' | 'dark' | 'system';

package/js/utils/architecture.ts

@@ -0,0 +1,22 @@
+import { NativeModules, TurboModuleRegistry, TurboModule } from 'react-native';
+
+declare const global: {
+  __turboModuleProxy: unknown;
+  nativeFabricUIManager: unknown;
+};
+
+export const isNewArchitecture = global.__turboModuleProxy != null;
+
+export const isFabricEnabled = global.nativeFabricUIManager != null;
+
+/**
+ * Gets the native module for both old and new architectures
+ * @param moduleName The name of the module
+ * @returns The native module
+ */
+export function getNativeModule<T extends TurboModule>(moduleName: string): T {
+  if (isNewArchitecture) {
+    return TurboModuleRegistry.getEnforcing<T>(moduleName);
+  }
+  return NativeModules[moduleName] as T;
+}

package/lib/codegenSpecs/NativeMParticle.d.ts

@@ -0,0 +1,148 @@
+import type { TurboModule } from 'react-native';
+export type CustomAttributes = {
+    [key: string]: string | number | boolean;
+};
+export type UserAttributes = {
+    [key: string]: string | string[] | number | boolean | null;
+};
+export type UserIdentities = {
+    [key: string]: string;
+};
+export interface Product {
+    name: string;
+    sku: string;
+    price: number;
+    quantity?: number;
+    brand?: string;
+    couponCode?: string;
+    position?: number;
+    category?: string;
+    variant?: string;
+    customAttributes?: CustomAttributes;
+}
+export interface TransactionAttributes {
+    transactionId: string;
+    affiliation?: string;
+    revenue?: number;
+    shipping?: number;
+    tax?: number;
+    couponCode?: string;
+}
+export interface Promotion {
+    id: string;
+    name: string;
+    creative: string;
+    position: string;
+}
+export interface Impression {
+    impressionListName: string;
+    products: Product[];
+}
+export interface CommerceEvent {
+    productActionType?: number;
+    promotionActionType?: number;
+    products?: Product[];
+    transactionAttributes?: TransactionAttributes;
+    promotions?: Promotion[];
+    impressions?: Impression[];
+    screenName?: string;
+    currency?: string;
+    customAttributes?: CustomAttributes;
+    checkoutOptions?: string;
+    productActionListName?: string;
+    productActionListSource?: string;
+    checkoutStep?: number;
+    nonInteractive?: boolean;
+    shouldUploadEvent?: boolean;
+}
+export interface Event {
+    category?: string;
+    duration?: number;
+    endTime?: number;
+    info?: CustomAttributes;
+    name?: string;
+    startTime?: number;
+    type?: number;
+    shouldUploadEvent?: boolean;
+    customFlags?: {
+        [key: string]: string;
+    };
+}
+export interface GDPRConsent {
+    consented?: boolean;
+    document?: string | null;
+    timestamp?: number;
+    location?: string | null;
+    hardwareId?: string | null;
+}
+export interface CCPAConsent {
+    consented?: boolean;
+    document?: string | null;
+    timestamp?: number;
+    location?: string | null;
+    hardwareId?: string | null;
+}
+export type AttributionResult = {
+    [key: string]: {
+        [key: string]: string | number | boolean;
+    };
+};
+export interface CallbackError {
+    message: string;
+    code?: number;
+    httpCode?: number;
+    responseCode?: number;
+    mpid?: string;
+    errors?: string;
+}
+export type IdentityRequest = {
+    [key: number]: string;
+};
+export interface AliasRequest {
+    sourceMpid?: string;
+    destinationMpid?: string;
+    startTime?: number;
+    endTime?: number;
+}
+export interface IdentityResult {
+    userId: string;
+    previousUserId: string;
+}
+export interface Spec extends TurboModule {
+    upload(): void;
+    setUploadInterval(uploadInterval: number): void;
+    logEvent(eventName: string, eventType: number, attributes: CustomAttributes | null): void;
+    logMPEvent(event: Event): void;
+    logCommerceEvent(commerceEvent: CommerceEvent): void;
+    logScreenEvent(screenName: string, attributes: CustomAttributes | null, shouldUploadEvent: boolean): void;
+    setATTStatus(status: number): void;
+    setATTStatusWithCustomTimestamp(status: number, timestamp: number): void;
+    setOptOut(optOut: boolean): void;
+    getOptOut(callback: (result: boolean) => void): void;
+    addGDPRConsentState(consent: GDPRConsent, purpose: string): void;
+    removeGDPRConsentStateWithPurpose(purpose: string): void;
+    setCCPAConsentState(consent: CCPAConsent): void;
+    removeCCPAConsentState(): void;
+    isKitActive(kitId: number, callback: (result: boolean) => void): void;
+    getAttributions(callback: (result: AttributionResult) => void): void;
+    logPushRegistration(token: string, senderId: string): void;
+    getSession(callback: (result: string | null) => void): void;
+    setLocation(latitude: number, longitude: number): void;
+    setUserAttribute(mpid: string, key: string, value: string): void;
+    setUserAttributeArray(mpid: string, key: string, value: Array<string>): void;
+    getUserAttributes(mpid: string, callback: (error: CallbackError | null, result: UserAttributes | null) => void): void;
+    setUserTag(mpid: string, tag: string): void;
+    incrementUserAttribute(mpid: string, key: string, value: number): void;
+    removeUserAttribute(mpid: string, key: string): void;
+    getUserIdentities(mpid: string, callback: (error: CallbackError | null, result: UserIdentities | null) => void): void;
+    getFirstSeen(mpid: string, callback: (result: string) => void): void;
+    getLastSeen(mpid: string, callback: (result: string) => void): void;
+    getCurrentUserWithCompletion(callback: (error: CallbackError | null, userId: string | null) => void): void;
+    identify(identityRequest: IdentityRequest, callback: (error: CallbackError | null, userId: string | null, previousUserId: string | null) => void): void;
+    login(identityRequest: IdentityRequest, callback: (error: CallbackError | null, userId: string | null, previousUserId: string | null) => void): void;
+    logout(identityRequest: IdentityRequest, callback: (error: CallbackError | null, userId: string | null, previousUserId: string | null) => void): void;
+    modify(identityRequest: IdentityRequest, callback: (error: CallbackError | null, userId: string | null, previousUserId: string | null) => void): void;
+    aliasUsers(aliasRequest: AliasRequest, callback: (success: boolean, message?: string) => void): void;
+}
+declare const _default: Spec;
+export default _default;

package/lib/codegenSpecs/NativeMParticle.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_native_1 = require("react-native");
+exports.default = react_native_1.TurboModuleRegistry.getEnforcing('RNMParticle');
+//# sourceMappingURL=NativeMParticle.js.map

package/lib/codegenSpecs/NativeMParticle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NativeMParticle.js","sourceRoot":"","sources":["../../js/codegenSpecs/NativeMParticle.ts"],"names":[],"mappings":";;AACA,+CAAmD;AAoNnD,kBAAe,kCAAmB,CAAC,YAAY,CAAO,aAAa,CAAC,CAAC"}

package/lib/codegenSpecs/rokt/NativeMPRokt.d.ts

@@ -0,0 +1,24 @@
+import type { TurboModule } from 'react-native';
+type ColorMode = string;
+type CacheConfig = {
+    readonly cacheDurationInSeconds?: number;
+    readonly cacheAttributes?: {
+        [key: string]: string;
+    };
+};
+type RoktConfigType = {
+    readonly colorMode?: ColorMode;
+    readonly cacheConfig?: CacheConfig;
+};
+export interface Spec extends TurboModule {
+    selectPlacements(identifier: string, attributes?: {
+        [key: string]: string;
+    }, placeholders?: {
+        [key: string]: number | null;
+    }, roktConfig?: RoktConfigType, fontFilesMap?: {
+        [key: string]: string;
+    }): void;
+    purchaseFinalized(placementId: string, catalogItemId: string, success: boolean): void;
+}
+declare const _default: Spec;
+export default _default;

package/lib/codegenSpecs/rokt/NativeMPRokt.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_native_1 = require("react-native");
+exports.default = react_native_1.TurboModuleRegistry.getEnforcing('RNMPRokt');
+//# sourceMappingURL=NativeMPRokt.js.map

package/lib/codegenSpecs/rokt/NativeMPRokt.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NativeMPRokt.js","sourceRoot":"","sources":["../../../js/codegenSpecs/rokt/NativeMPRokt.ts"],"names":[],"mappings":";;AACA,+CAAmD;AA8BnD,kBAAe,kCAAmB,CAAC,YAAY,CAAO,UAAU,CAAC,CAAC"}

package/lib/codegenSpecs/rokt/RoktLayoutNativeComponent.d.ts

@@ -0,0 +1,18 @@
+import type { HostComponent, ViewProps } from 'react-native';
+import type { DirectEventHandler } from 'react-native/Libraries/Types/CodegenTypes';
+type HeightChangedEvent = {
+    height: string;
+};
+type MarginChangedEvent = {
+    marginTop: string;
+    marginRight: string;
+    marginLeft: string;
+    marginBottom: string;
+};
+export interface NativeProps extends ViewProps {
+    placeholderName: string;
+    onLayoutHeightChanged?: DirectEventHandler<HeightChangedEvent>;
+    onLayoutMarginChanged?: DirectEventHandler<MarginChangedEvent>;
+}
+declare const _default: HostComponent<NativeProps>;
+export default _default;

package/lib/codegenSpecs/rokt/RoktLayoutNativeComponent.js

@@ -0,0 +1,8 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const codegenNativeComponent_1 = __importDefault(require("react-native/Libraries/Utilities/codegenNativeComponent"));
+exports.default = (0, codegenNativeComponent_1.default)('RoktNativeLayout');
+//# sourceMappingURL=RoktLayoutNativeComponent.js.map

package/lib/codegenSpecs/rokt/RoktLayoutNativeComponent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RoktLayoutNativeComponent.js","sourceRoot":"","sources":["../../../js/codegenSpecs/rokt/RoktLayoutNativeComponent.ts"],"names":[],"mappings":";;;;;AAEA,qHAA6F;AAwB7F,kBAAe,IAAA,gCAAsB,EACnC,kBAAkB,CACW,CAAC"}