@adobe/react-native-aepmessaging 7.3.0 → 7.4.0

package/src/Messaging.ts

@@ -14,12 +14,18 @@ import {
   NativeModules,
   NativeEventEmitter,
   NativeModule,
-  Platform
-} from 'react-native';
-import Message from './models/Message';
-import { MessagingDelegate } from './models/MessagingDelegate';
-import { MessagingProposition } from './models/MessagingProposition';
-import { ContentCard } from './models/ContentCard';
+  Platform,
+} from "react-native";
+import Message from "./models/Message";
+import { MessagingDelegate } from "./models/MessagingDelegate";
+import { MessagingProposition } from "./models/MessagingProposition";
+import { ContentCard } from "./models/ContentCard";
+import { PersonalizationSchema } from "./models/PersonalizationSchema";
+import { ContentTemplate } from "./ui/types/Templates";
+import {
+  InboxSettings,
+  SettingsPlacement,
+} from "./ui/providers/InboxProvider";
 
 export interface NativeMessagingModule {
   extensionVersion: () => Promise<string>;
@@ -35,9 +41,20 @@ export interface NativeMessagingModule {
     shouldSaveMessage: boolean
   ) => void;
   updatePropositionsForSurfaces: (surfaces: string[]) => void;
-  trackContentCardDisplay: (proposition: MessagingProposition, contentCard: ContentCard) => void;
-  trackContentCardInteraction: (proposition: MessagingProposition, contentCard: ContentCard) => void;
-  trackPropositionItem: (itemId: string, interaction: string | null, eventType: number, tokens: string[] | null) => void;
+  trackContentCardDisplay: (
+    proposition: MessagingProposition,
+    contentCard: ContentCard
+  ) => void;
+  trackContentCardInteraction: (
+    proposition: MessagingProposition,
+    contentCard: ContentCard
+  ) => void;
+  trackPropositionItem: (
+    itemId: string,
+    interaction: string | null,
+    eventType: number,
+    tokens: string[] | null
+  ) => void;
 }
 
 const RCTAEPMessaging: NativeModule & NativeMessagingModule =
@@ -46,6 +63,134 @@ const RCTAEPMessaging: NativeModule & NativeMessagingModule =
 declare var messagingDelegate: MessagingDelegate;
 var messagingDelegate: MessagingDelegate;
 
+function optString(map: Record<string, any> | undefined, key: string): string | undefined {
+  if (!map || typeof map !== 'object') return undefined;
+  const val = map[key] ?? map[key.toLowerCase()];
+  return typeof val === 'string' ? val : undefined;
+}
+
+function optInt(map: Record<string, any> | undefined, key: string, fallback: number): number {
+  if (!map || typeof map !== 'object') return fallback;
+  const val = map[key] ?? map[key.toLowerCase()];
+  if (typeof val === 'number' && !isNaN(val)) return val;
+  if (typeof val === 'string') {
+    const n = parseInt(val, 10);
+    return isNaN(n) ? fallback : n;
+  }
+  return fallback;
+}
+
+function optBoolean(map: Record<string, any> | undefined, key: string, fallback: boolean): boolean {
+  if (!map || typeof map !== 'object') return fallback;
+  const val = map[key] ?? map[key.toLowerCase()];
+  if (typeof val === 'boolean') return val;
+  if (val === 'true' || val === 1) return true;
+  if (val === 'false' || val === 0) return false;
+  return fallback;
+}
+
+function optTypedMap(map: Record<string, any> | undefined, key: string): Record<string, any> {
+  if (!map || typeof map !== 'object') return {};
+  const val = map[key] ?? map[key.toLowerCase()];
+  return val && typeof val === 'object' && !Array.isArray(val) ? val : {};
+}
+
+function createAepText(map: Record<string, any> | undefined, key: string): { content: string } | undefined {
+  const nested = optTypedMap(map, key);
+  const content = optString(nested, 'content') ?? optString(nested, 'txt');
+  return content !== undefined ? { content } : undefined;
+}
+
+function createAepColor(clrMap: Record<string, any>): { light: string; dark: string } | undefined {
+  if (!clrMap || typeof clrMap !== 'object') return undefined;
+  const light = optString(clrMap, 'light') ?? optString(clrMap, 'default') ?? '#FFFFFF';
+  const dark = optString(clrMap, 'dark') ?? light;
+  return { light, dark };
+}
+
+function createAepImage(map: Record<string, any> | undefined): { url: string; darkUrl?: string } | undefined {
+  if (!map || typeof map !== 'object') return undefined;
+  const url = optString(map, 'url') ?? optString(map, 'src');
+  if (!url) return undefined;
+  const darkUrl = optString(map, 'darkUrl') ?? optString(map, 'dark');
+  return { url, darkUrl };
+}
+
+function createAlignment(placement: string | undefined): SettingsPlacement {
+  const p = (placement ?? '').toLowerCase();
+  if (['topleft', 'topright', 'bottomleft', 'bottomright'].includes(p)) {
+    return p as SettingsPlacement;
+  }
+  return 'topleft';
+}
+
+function createInboxSettingsFromContent(
+  contentMap: Record<string, any>,
+  activityId?: string
+): InboxSettings {
+  const heading = createAepText(contentMap, 'heading') ?? createAepText(contentMap, 'Heading');
+  const layoutMap = optTypedMap(contentMap, 'layout');
+  const orientation = (optString(layoutMap, 'orientation') ?? 'vertical') as 'horizontal' | 'vertical';
+  const capacity = optInt(contentMap, 'capacity', 15);
+
+  if (!heading || !heading.content) {
+    throw new Error(
+      'Messaging.getInbox: inbox content is missing a valid heading (heading.content).'
+    );
+  }
+
+  const emptyStateSettings = optTypedMap(contentMap, 'emptyStateSettings') ||
+    optTypedMap(contentMap, 'empty_state_settings') || {};
+  const emptyMessage = createAepText(emptyStateSettings, 'message') ?? createAepText(emptyStateSettings, 'Message');
+  const emptyImage = createAepImage(optTypedMap(emptyStateSettings, 'image'));
+
+  const unreadIndicator = optTypedMap(contentMap, 'unread_indicator') ||
+    optTypedMap(contentMap, 'unreadIndicator') || {};
+  const unreadBg = optTypedMap(unreadIndicator, 'unread_bg') || optTypedMap(unreadIndicator, 'unreadBg') || {};
+  const unreadBgClr = optTypedMap(unreadBg, 'clr') || {};
+  const unreadBgColor = createAepColor(unreadBgClr);
+
+  const unreadIcon = optTypedMap(unreadIndicator, 'unread_icon') || optTypedMap(unreadIndicator, 'unreadIcon') || {};
+  const placement = createAlignment(optString(unreadIndicator, 'placement') ?? optString(unreadIcon, 'placement'));
+  const unreadIconImage = createAepImage(optTypedMap(unreadIcon, 'image'));
+
+  const isUnreadEnabled = optBoolean(contentMap, 'isUnreadEnabled', true) ||
+    optBoolean(contentMap, 'is_unread_enabled', true);
+
+  const content: InboxSettings['content'] = {
+    heading,
+    layout: { orientation },
+    capacity,
+    emptyStateSettings: {
+      message: emptyMessage ?? { content: 'No Content Available' },
+      ...(emptyImage && { image: emptyImage }),
+    },
+    isUnreadEnabled,
+  };
+
+  if (isUnreadEnabled && (unreadBgColor || unreadIconImage)) {
+    content.unread_indicator = {
+      unread_bg: {
+        clr: unreadBgColor ?? { light: '#FFF3E0', dark: '#2D1B0E' },
+      },
+      unread_icon: {
+        placement,
+        image: unreadIconImage ?? {
+          url: 'https://icons.veryicon.com/png/o/leisure/crisp-app-icon-library-v3/notification-5.png',
+          darkUrl: '',
+        },
+      },
+    };
+  }
+
+  return {
+    ...(activityId && { activityId }),
+    content,
+    showPagination: optBoolean(contentMap, 'showPagination', false) ||
+      optBoolean(contentMap, 'show_pagination', false),
+  };
+}
+
 class Messaging {
   /**
    * Returns the version of the AEPMessaging extension
@@ -106,29 +251,45 @@ class Messaging {
   
   /**
    * @deprecated Use PropositionItem.track(...) instead.
-   */
-  static trackContentCardDisplay(proposition: MessagingProposition, contentCard: ContentCard): void {
+   */  
+  static trackContentCardDisplay(
+    proposition: MessagingProposition,
+    contentCard: ContentCard
+  ): void {
     RCTAEPMessaging.trackContentCardDisplay(proposition, contentCard);
   }
 
-  /**
+   /**
    * @deprecated Use PropositionItem.track(...) instead.
    */
-  static trackContentCardInteraction(proposition: MessagingProposition, contentCard: ContentCard): void {
+  static trackContentCardInteraction(
+    proposition: MessagingProposition,
+    contentCard: ContentCard
+  ): void {
     RCTAEPMessaging.trackContentCardInteraction(proposition, contentCard);
   }
 
   /**
    * Tracks interactions with a PropositionItem using the provided interaction and event type.
    * This method is used internally by the PropositionItem.track() method.
-   * 
+   *
    * @param {string} itemId - The unique identifier of the PropositionItem
    * @param {string | null} interaction - A custom string value to be recorded in the interaction
    * @param {number} eventType - The MessagingEdgeEventType numeric value
    * @param {string[] | null} tokens - Array containing the sub-item tokens for recording interaction
    */
-  static trackPropositionItem(itemId: string, interaction: string | null, eventType: number, tokens: string[] | null): void {
-    RCTAEPMessaging.trackPropositionItem(itemId, interaction, eventType, tokens);
+  static trackPropositionItem(
+    itemId: string,
+    interaction: string | null,
+    eventType: number,
+    tokens: string[] | null
+  ): void {
+    RCTAEPMessaging.trackPropositionItem(
+      itemId,
+      interaction,
+      eventType,
+      tokens
+    );
   }
 
   /**
@@ -140,18 +301,18 @@ class Messaging {
 
     const eventEmitter = new NativeEventEmitter(RCTAEPMessaging);
 
-    eventEmitter.addListener('onShow', (message: Message) =>
+    eventEmitter.addListener("onShow", (message: Message) =>
       messagingDelegate?.onShow?.(new Message(message))
     );
 
-    eventEmitter.addListener('onDismiss', (message: Message) => {
+    eventEmitter.addListener("onDismiss", (message: Message) => {
       const messageInstance = new Message(message);
       messageInstance._clearJavascriptMessageHandlers();
       messageInstance._clearJavascriptResultHandlers();
       messagingDelegate?.onDismiss?.(messageInstance);
     });
 
-    eventEmitter.addListener('shouldShowMessage', (message: Message) => {
+    eventEmitter.addListener("shouldShowMessage", (message: Message) => {
       const messageInstance = new Message(message);
       const shouldShowMessage =
         messagingDelegate?.shouldShowMessage?.(messageInstance) ?? true;
@@ -160,26 +321,34 @@ class Messaging {
       RCTAEPMessaging.setMessageSettings(shouldShowMessage, shouldSaveMessage);
     });
 
-    if (Platform.OS === 'ios') {
-      eventEmitter.addListener('urlLoaded', (event: {url: string, message: Message}) =>
-        messagingDelegate?.urlLoaded?.(event.url, new Message(event.message))
+    if (Platform.OS === "ios") {
+      eventEmitter.addListener(
+        "urlLoaded",
+        (event: { url: string; message: Message }) =>
+          messagingDelegate?.urlLoaded?.(event.url, new Message(event.message))
       );
     }
 
-    if (Platform.OS === 'android') {
-      eventEmitter.addListener('onContentLoaded', (event: {message: Message}) =>
-        messagingDelegate?.onContentLoaded?.(new Message(event.message))
+    if (Platform.OS === "android") {
+      eventEmitter.addListener(
+        "onContentLoaded",
+        (event: { message: Message }) =>
+          messagingDelegate?.onContentLoaded?.(new Message(event.message))
       );
     }
 
     RCTAEPMessaging.setMessagingDelegate();
 
     return () => {
-      eventEmitter.removeAllListeners('onDismiss');
-      eventEmitter.removeAllListeners('onShow');
-      eventEmitter.removeAllListeners('shouldShowMessage');
-      eventEmitter.removeAllListeners('urlLoaded');
-      eventEmitter.removeAllListeners('onContentLoaded');
+      eventEmitter.removeAllListeners("onDismiss");
+      eventEmitter.removeAllListeners("onShow");
+      eventEmitter.removeAllListeners("shouldShowMessage");
+      if (Platform.OS === "ios") {
+        eventEmitter.removeAllListeners("urlLoaded");
+      }
+      if (Platform.OS === "android") {
+        eventEmitter.removeAllListeners("onContentLoaded");
+      }
     };
   }
 
@@ -201,8 +370,94 @@ class Messaging {
    * Dispatches an event to fetch propositions for the provided surfaces from remote.
    * @param surfaces A list of surface names to update
    */
-  static updatePropositionsForSurfaces(surfaces: string[]) {
-    RCTAEPMessaging.updatePropositionsForSurfaces(surfaces);
+  static async updatePropositionsForSurfaces(
+    surfaces: string[]
+  ): Promise<void> {
+    return await RCTAEPMessaging.updatePropositionsForSurfaces(surfaces);
+  }
+
+  /**
+   * @experimental
+   * Retrieves the content card UI data for a given surface.
+   * @param surface The surface to get the content card UI data for
+   * @returns The content card UI data for the given surface
+   */
+  static async getContentCardUI(surface: string): Promise<ContentTemplate[]> {
+    const messages = await Messaging.getPropositionsForSurfaces([surface]);
+    const propositions = messages[surface];
+    if (!propositions?.length) {
+      return [];
+    }
+    const contentCards = propositions
+      .flatMap((proposition) =>
+        proposition.items.filter(
+          (item) => item.schema === PersonalizationSchema.CONTENT_CARD
+        )
+      );
+
+    if (!contentCards?.length) {
+      return [];
+    }
+
+    return contentCards.map((card: any) => {
+    // Test: To mark first 2 cards as read, swap the two map lines above to add index, then replace isRead with:
+    // return contentCards.map((card: any, index: number) => {
+      const type = card.data?.meta?.adobe?.template ?? "SmallImage";
+      const isRead = card.data?.read ?? false;
+      // const isRead = card.data?.read ?? (index < 2);
+      return new ContentTemplate(card, type, isRead);
+    });
+  }
+
+
+  /**
+   * @experimental
+   * Loads inbox UI settings from the inbox proposition for the given surface.
+   * @throws {Error} When no propositions, no inbox proposition, or invalid inbox content is returned.
+   */
+  static async getInbox(surface: string): Promise<InboxSettings> {
+    const propositionsMap = await Messaging.getPropositionsForSurfaces([surface]);
+    const propositions = propositionsMap[surface];
+
+    if (!propositions?.length) {
+      throw new Error(
+        `Messaging.getInbox: no propositions returned for surface "${surface}".`
+      );
+    }
+
+    const inboxPropositions = propositions.filter(
+      (p) =>
+        p.items?.length > 0 &&
+        (p.items[0].schema === PersonalizationSchema.INBOX ||
+          String(p.items[0].schema).includes('inbox'))
+    );
+
+    if (inboxPropositions.length === 0) {
+      throw new Error(
+        `Messaging.getInbox: no inbox proposition found for surface "${surface}".`
+      );
+    }
+
+    const sortedByRank = [...inboxPropositions].sort(
+      (a, b) => ((b as any).rank ?? 0) - ((a as any).rank ?? 0)
+    );
+    const inboxProposition = sortedByRank[0];
+    const firstItem = inboxProposition.items[0];
+    const rawItem = firstItem as any;
+
+    const contentMap =
+      rawItem?.inboxSchemaData?.content ??
+      rawItem?.data?.inboxSchemaData?.content ??
+      rawItem?.data?.content;
+
+    if (!contentMap || typeof contentMap !== 'object') {
+      throw new Error(
+        `Messaging.getInbox: inbox proposition has no valid content configuration for surface "${surface}".`
+      );
+    }
+
+    const activityId = inboxProposition.scopeDetails?.activity?.id;
+    return createInboxSettingsFromContent(contentMap, activityId);
   }
 }
 

package/src/index.ts

@@ -11,7 +11,6 @@ governing permissions and limitations under the License.
 */
 
 import Messaging from './Messaging';
-import { ContentCard, ContentCardData } from './models/ContentCard';
 
 import { InAppMessage } from './models/InAppMessage';
 import { HTMLProposition, HTMLPropositionData } from './models/HTMLProposition';
@@ -26,11 +25,12 @@ import { PersonalizationSchema } from './models/PersonalizationSchema';
 import { PropositionItem, PropositionItemData } from './models/PropositionItem';
 import { Activity, Characteristics } from './models/ScopeDetails';
 
+export * from './models/ContentCard';
+export * from './ui';
+
 export {
   Activity,
   Characteristics,
-  ContentCard,
-  ContentCardData,
   InAppMessage,
   Messaging,
   Message,

package/src/models/ContentCard.ts

@@ -13,46 +13,71 @@
 import { PersonalizationSchema } from './PersonalizationSchema';
 import { PropositionItem, PropositionItemData } from './PropositionItem';
 
-type ContentCardTemplate = 'SmallImage';
-type DismissButtonStyle = 'circle' | 'none' | 'simple';
+export type ContentCardTemplate = 'SmallImage' | 'LargeImage' | 'ImageOnly';
+export type DismissButtonStyle = 'circle' | 'none' | 'simple';
+
+export interface ContentCardButton {
+  readonly interactId: string;
+  readonly actionUrl?: string;
+  readonly id?: string;
+  readonly text: {
+    readonly content: string;
+  };
+}
+
+export interface ContentCardContent {
+  readonly image?: {
+    readonly alt?: string;
+    readonly url: string;
+    readonly darkUrl?: string;
+  };
+  readonly buttons?: readonly ContentCardButton[];
+  readonly dismissBtn?: {
+    readonly style: DismissButtonStyle;
+  };
+  readonly actionUrl?: string;
+  readonly body?: {
+    readonly content: string;
+  };
+  readonly title: {
+    readonly content: string;
+  };
+}
+
+export type ImageOnlyContent = Pick<
+  ContentCardContent,
+  'image' | 'dismissBtn' | 'actionUrl'
+>;
+
+export type LargeImageContentData = ContentCardContent;
+
+export type SmallImageContentData = ContentCardContent;
+
+export interface ContentCardMeta {
+  [key: string]: any;
+  adobe: { template: ContentCardTemplate };
+  surface?: string;
+}
 
 export interface ContentCardData extends PropositionItemData {
   id: string;
+  schema: PersonalizationSchema.CONTENT_CARD;
   data: {
     contentType: 'application/json';
     expiryDate: number;
     publishedDate: number;
-    content: {
-      actionUrl: string;
-
-      body: { content: string };
-      title: { content: string };
-      buttons: Array<{
-        actionUrl: string;
-        id: string;
-        text: { content: string };
-        interactId: string;
-      }>;
-      image: { alt: string; url: string };
-      dismissBtn: { style: DismissButtonStyle };
-    };
-    meta: {
-      [key: string]: any;
-      adobe: { template: ContentCardTemplate };
-      dismissState: boolean;
-      readState: boolean;
-      surface: string;
-    };
+    meta: ContentCardMeta;
+    content: SmallImageContentData | LargeImageContentData | ImageOnlyContent;
   };
-  schema: PersonalizationSchema.CONTENT_CARD;
 }
 
 export class ContentCard extends PropositionItem {
-  declare data: ContentCardData['data']; // Override data type for better typing
+  data: ContentCardData['data'];
+  isRead: boolean = false;
 
-  constructor(contentCardData: ContentCardData) {
+  constructor(contentCardData: ContentCardData, isRead: boolean = false) {
     super(contentCardData);
     this.data = contentCardData.data;
+    this.isRead = isRead;
   }
-
 }

package/src/models/HTMLProposition.ts

@@ -21,7 +21,7 @@ export interface HTMLPropositionData extends PropositionItemData {
 }
 
 export class HTMLProposition extends PropositionItem {
-	declare data: HTMLPropositionData['data'];
+	data: HTMLPropositionData['data'];
 
 	constructor(htmlData: HTMLPropositionData) {
 		super(htmlData);

package/src/models/JSONProposition.ts

@@ -21,7 +21,7 @@ export interface JSONPropositionData extends PropositionItemData {
 }
 
 export class JSONPropositionItem extends PropositionItem {
-	declare data: JSONPropositionData['data'];
+	data: JSONPropositionData['data'];
 
 	constructor(jsonData: JSONPropositionData) {
 		super(jsonData);

package/src/models/PersonalizationSchema.ts

@@ -15,6 +15,7 @@ export enum PersonalizationSchema {
   DEFAULT_CONTENT = 'https://ns.adobe.com/personalization/default-content-item',
   HTML_CONTENT = 'https://ns.adobe.com/personalization/html-content-item',
   IN_APP = 'https://ns.adobe.com/personalization/message/in-app',
+  INBOX = 'https://ns.adobe.com/personalization/message/inbox',
   JSON_CONTENT = 'https://ns.adobe.com/personalization/json-content-item',
   NATIVE_ALERT = 'https://ns.adobe.com/personalization/message/native-alert',
   RULESET_ITEM = 'https://ns.adobe.com/personalization/ruleset-item'

package/src/models/index.ts

@@ -0,0 +1,22 @@
+/*
+    Copyright 2026 Adobe. All rights reserved.
+    This file is licensed to you under the Apache License, Version 2.0 (the
+    "License"); you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+    http://www.apache.org/licenses/LICENSE-2.0 Unless required by applicable law
+    or agreed to in writing, software distributed under the License is
+    distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS OF
+    ANY KIND, either express or implied. See the License for the specific
+    language governing permissions and limitations under the License.
+*/
+
+export * from './ContentCard';
+export * from './InAppMessage';
+export * from './JSONProposition';
+export * from './Message';
+export * from './MessagingDelegate';
+export * from './MessagingEdgeEventType';
+export * from './MessagingProposition';
+export * from './MessagingPropositionItem';
+export * from './PersonalizationSchema';
+export * from './ScopeDetails';