@liquidcommercedev/rmn-sdk 1.4.6-beta.8 → 1.5.0-beta.1

package/dist/types/common/helpers/uuid.helper.d.ts

@@ -0,0 +1,49 @@
+export declare class UniqueIdGenerator {
+    private static readonly epoch;
+    private static readonly nodeBits;
+    private static readonly sequenceBits;
+    private static lastTimestamp;
+    private static sequence;
+    private static nodeId;
+    private static readonly base32Chars;
+    /**
+     * Initialize the generator with a node ID
+     * @param nodeId Number between 0-1023 to identify this instance
+     */
+    static initialize(nodeId?: number): void;
+    /**
+     * Convert a number to base32 string with specified length
+     */
+    private static toBase32;
+    /**
+     * Generate a cryptographically secure random number
+     */
+    private static getSecureRandom;
+    /**
+     * Wait until next millisecond
+     */
+    private static waitNextMillis;
+    /**
+     * Generates a highly unique ID with the following format:
+     * TTTTTTTTTTCCCCNNNNNRRRR
+     * T: Timestamp (10 chars)
+     * C: Counter (4 chars)
+     * N: Node ID (5 chars)
+     * R: Random (4 chars)
+     *
+     * Total length: 23 characters, always uppercase alphanumeric
+     */
+    static generate(): string;
+    /**
+     * Validates if a string matches the expected ID format
+     */
+    static isValid(id: string): boolean;
+    /**
+     * Decode base32 string to number
+     */
+    private static decodeBase32;
+    /**
+     * Extract timestamp from ID
+     */
+    static getTimestamp(id: string): Date;
+}

package/dist/types/index.umd.d.ts

@@ -1,2 +1,2 @@
-import { RmnClient, RmnCreateSpotElement } from './index';
-export { RmnClient, RmnCreateSpotElement };
+import { RmnClient, RmnCreateSpotElement, RmnEventManager } from './index';
+export { RmnClient, RmnCreateSpotElement, RmnEventManager };

package/dist/types/modules/element/component/carousel/carousel.interface.d.ts

@@ -4,6 +4,8 @@ export interface ICarouselDotOptions {
     position: CarouselNavPositionType;
     color: string;
     activeColor: string;
+    size: 'small' | 'base' | 'large';
+    opacity: number;
 }
 export interface ICarouselButtonOptions {
     position: CarouselNavPositionType;
@@ -11,6 +13,8 @@ export interface ICarouselButtonOptions {
     textColor: string;
     backgroundColor: string;
     borderRadius: string;
+    size: 'small' | 'base' | 'large';
+    opacity: number;
     prev: string;
     next: string;
 }

package/dist/types/modules/element/element.interface.d.ts

@@ -9,15 +9,16 @@ export interface ISpotColors {
     ctaBorderColor?: string;
 }
 export interface ISpotOverlay {
+    size: 'small' | 'base' | 'large';
     color: string;
-    colorStop: string;
+    opacity: 'light' | 'medium' | 'dark';
 }
 export interface IInjectSpotElementConfig {
     fluid?: boolean;
     url?: string;
     colors?: ISpotColors;
     minScale?: number;
-    overlay?: ISpotOverlay[];
+    overlay?: ISpotOverlay;
     carousel?: ICarouselOptions;
 }
 export interface IInjectSpotElement {
@@ -46,6 +47,6 @@ export interface IElementService {
 export interface IRmnCreateSpotElementConfig {
     fluid?: boolean;
     colors?: ISpotColors;
-    overlay?: ISpotOverlay[];
+    overlay?: ISpotOverlay;
     minScale?: number;
 }

package/dist/types/modules/element/template/helper.d.ts

@@ -1,3 +1,4 @@
 import type { ISpotOverlay } from '../element.interface';
-export declare function linearGradientColorStop(overlay: ISpotOverlay[], fallback: string): string;
+export declare function convertHexToRgba(hex: string, opacity?: number): string;
+export declare function generateGradientColor(overlay?: ISpotOverlay, fallback?: string): string;
 export declare function spotHtmlStringToElement(htmlString: string): HTMLElement;

package/dist/types/modules/element/template/template.type.d.ts

@@ -3,7 +3,7 @@ import type { SpotVariantType } from 'modules/selection';
 import type { ISpot } from 'types';
 import type { ISpotOverlay } from '../element.interface';
 export interface ISpotTemplateConfig {
-    overlay?: ISpotOverlay[];
+    overlay?: ISpotOverlay;
     prefix?: string;
 }
 export type TemplateFunction = (spot: ISpot, config: ISpotTemplateConfig) => string;

package/dist/types/modules/event/event.interface.d.ts

@@ -10,8 +10,8 @@ export interface ILSIdentifier {
     spotType: string;
 }
 export interface ILSDom {
-    visible: boolean;
-    element?: HTMLElement;
+    visibleOnViewport: boolean;
+    spotElement?: HTMLElement;
 }
 export interface ILSState {
     mounted: boolean;
@@ -33,12 +33,12 @@ export interface ILifecycleState {
 export interface IClickEvent {
     placementId: string;
     spotId: string;
-    element: HTMLElement;
+    spotElement: HTMLElement;
 }
 export interface IImpressionEvent {
     placementId: string;
     spotId: string;
-    element: HTMLElement;
+    spotElement: HTMLElement;
 }
 export interface IAddToCartEvent {
     placementId: string;
@@ -67,6 +67,6 @@ export interface IEventMap {
 }
 export interface IRegisterSpotParams {
     placementId: string;
-    element: HTMLElement;
+    spotElement: HTMLElement;
     spot: ISpot;
 }

package/dist/types/modules/event/event.service.d.ts

@@ -3,6 +3,7 @@ import type { IEventMap, ILifecycleState, IRegisterSpotParams } from './event.in
 export declare class EventService {
     private static instance;
     private pubSub;
+    private localStorage;
     private intersectionObserver;
     private spotStates;
     private activeSpots;
@@ -10,10 +11,21 @@ export declare class EventService {
     static getInstance(): EventService;
     subscribe(eventType: RMN_SPOT_EVENT, callback: (data: IEventMap[RMN_SPOT_EVENT]) => void): () => void;
     publish(eventType: RMN_SPOT_EVENT, data: IEventMap[RMN_SPOT_EVENT]): void;
+    registerSpot(params: IRegisterSpotParams): void;
+    unregisterSpot(placementId: string): void;
+    /**
+     * Updates the state of a spot.
+     *
+     * @param {string} placementId - The placement ID of the spot.
+     * @param {Partial<ILifecycleState>} updates - The updates to apply to the spot state.
+     * @param {boolean} publish - Whether to publish the updated state.
+     *
+     * @returns {void}
+     */
     handleSpotState(placementId: string, updates: Partial<ILifecycleState>, publish?: boolean): void;
-    registerSpot({ placementId, element, spot }: IRegisterSpotParams): void;
-    unregisterSpot(spotId: string): void;
+    private handleClick;
     private handleIntersectionObserver;
+    private fireImpressionEvent;
     /**
      * Fires an event using the navigator.sendBeacon method and redirects the user if the event is a click event.
      *

package/dist/types/modules/event/helpers/index.d.ts

@@ -1,2 +1,3 @@
 export * from './intersection.service';
+export * from './localstorage.service';
 export * from './resize.service';

package/dist/types/modules/event/helpers/localstorage.service.d.ts

@@ -0,0 +1,26 @@
+import type { RMN_SPOT_TYPE } from 'enums';
+import type { ISpotEvent } from 'modules/selection';
+export interface ILocalStorageSpot {
+    spotId: string;
+    spotType: RMN_SPOT_TYPE;
+    events: ISpotEvent[];
+    productIds: Array<string | number>;
+    createdAt?: number;
+}
+export declare class LocalStorage {
+    private spots;
+    private static instance;
+    private static readonly localStorageKey;
+    private static readonly spotExpirationTime;
+    private constructor();
+    static getInstance(): LocalStorage;
+    private syncLocalStorage;
+    setSpot(spotId: string, data: ILocalStorageSpot): void;
+    getSpot(spotId: string): ILocalStorageSpot | undefined;
+    removeSpot(spotId: string): void;
+    private updateLocalStorage;
+    clearLocalStorage(): void;
+    private removeExpiredSpots;
+    private mapToObj;
+    private objToMap;
+}

package/dist/types/modules/event/pubsub.d.ts

@@ -2,17 +2,19 @@
  * Callback function type for event subscribers
  * @template T The type of data the callback receives
  */
-export type PSCallback<T> = (data: T) => void;
+export type PubSubCallback<T> = (data: T) => void;
 /**
  * Function type for unsubscribing from an event
  */
-export type PSUnsubscribe = () => void;
+export type PubSubUnsubscribe = () => void;
 /**
  * PubSub class
  * Manages event subscriptions and publications
  * @template IEventMap A record type defining the structure of events and their data
  */
 export declare class PubSub<IEventMap> {
+    private static instance;
+    static getInstance<IEventMap>(): PubSub<IEventMap>;
     /**
      * Object to store subscribers for each event type
      */
@@ -28,7 +30,7 @@ export declare class PubSub<IEventMap> {
      *   console.log(`User ${data.username} logged in`);
      * });
      */
-    subscribe<K extends keyof IEventMap>(eventType: K, callback: PSCallback<IEventMap[K]>): PSUnsubscribe;
+    subscribe<K extends keyof IEventMap>(eventType: K, callback: PubSubCallback<IEventMap[K]>): PubSubUnsubscribe;
     /**
      * Publish an event
      * @param eventType - The type of event to publish

package/dist/types/modules/selection/selection.interface.d.ts

@@ -29,6 +29,7 @@ export interface ISpot {
     secondaryImage?: string;
     mobilePrimaryImage?: string;
     mobileSecondaryImage?: string;
+    productIds?: Array<string | number>;
     productUpcs?: string[];
 }
 export type ISpots = Record<PlacementIdType, ISpot[]>;

package/dist/types/rmn-client.d.ts

@@ -1,9 +1,7 @@
 import type { IAuthCredentials } from 'modules/auth';
 import type { IInjectSpotElementParams, IRmnCreateSpotElementConfig } from 'modules/element';
-import { type IEventMap } from 'modules/event';
 import type { ISpot, ISpots, ISpotSelectionParams } from 'modules/selection';
-import type { IRmnClient, IRmnConfig } from 'types';
-import type { RMN_SPOT_EVENT } from './enums';
+import type { IRmnClient, IRmnConfig, IRmnEventManager } from 'types';
 export declare class LiquidCommerceRmnClient implements IRmnClient {
     private readonly selectionService;
     private readonly elementService;
@@ -29,15 +27,6 @@ export declare class LiquidCommerceRmnClient implements IRmnClient {
      * @return {Promise<void>} - A promise that resolves when the spot elements are injected.
      */
     injectSpotElement(params: IInjectSpotElementParams): Promise<void>;
-    /**
-     * Returns the event manager instance.
-     *
-     * @return {EventService} - The event manager instance.
-     */
-    eventManager: {
-        subscribe: (eventType: RMN_SPOT_EVENT, callback: (data: IEventMap[RMN_SPOT_EVENT]) => void) => (() => void);
-        publish: (eventType: RMN_SPOT_EVENT, data: IEventMap[RMN_SPOT_EVENT]) => void;
-    };
     /**
      * Makes a selection request on our server based on the provided data.
      *
@@ -79,6 +68,7 @@ export declare class LiquidCommerceRmnClient implements IRmnClient {
     private preventDuplicateSpotPlacementIds;
     private preventNonExistentSpotTypes;
     private updateSpotsState;
+    private useSpotSelectionExample;
 }
 /**
  * Creates a new instance of the RmnClient.
@@ -89,6 +79,12 @@ export declare class LiquidCommerceRmnClient implements IRmnClient {
  * @return {Promise<IRmnClient>} - The RmnClient instance.
  */
 declare function RmnClient(apiKey: string, config: IRmnConfig): Promise<IRmnClient>;
+/**
+ * Creates a new instance of the RmnEventManager.
+ *
+ * @return {IRmnEventManager} - The RmnEventManager instance.
+ */
+declare function RmnEventManager(): IRmnEventManager;
 /**
  * Creates the spot html element based on the provided data using shadow dom.
  *
@@ -102,4 +98,4 @@ declare function RmnClient(apiKey: string, config: IRmnConfig): Promise<IRmnClie
  * @return {HTMLElement | null} - The spot html element or null if the browser environment is not available.
  */
 declare function RmnCreateSpotElement(spot: ISpot, config?: IRmnCreateSpotElementConfig): HTMLElement | null;
-export { RmnClient, RmnCreateSpotElement };
+export { RmnClient, RmnCreateSpotElement, RmnEventManager };

package/dist/types/static.constant.d.ts

@@ -1,3 +1,4 @@
 import type { ISpotEvent, ISpots } from 'types';
 export declare const SPOT_EVENTS_EXAMPLE: ISpotEvent[];
 export declare const RB_SPOTS_SELECTION_EXAMPLE: Partial<ISpots>;
+export declare const IAB_SPOTS_SELECTION_EXAMPLE: Partial<ISpots>;

package/dist/types/types.d.ts

@@ -11,10 +11,11 @@ export interface IRmnClient {
         error: string;
     }>;
     injectSpotElement(params: IInjectSpotElementParams): Promise<void>;
-    eventManager: {
-        subscribe: (eventType: RMN_SPOT_EVENT, callback: (data: IEventMap[RMN_SPOT_EVENT]) => void) => () => void;
-        publish: (eventType: RMN_SPOT_EVENT, data: IEventMap[RMN_SPOT_EVENT]) => void;
-    };
+}
+export interface IRmnEventManager {
+    subscribe: (eventType: RMN_SPOT_EVENT, callback: (data: IEventMap[RMN_SPOT_EVENT]) => void) => () => void;
+    publish: (eventType: RMN_SPOT_EVENT, data: IEventMap[RMN_SPOT_EVENT]) => void;
+    destroySpot: (placementId: string) => void;
 }
 export interface IRmnConfig {
     env: RMN_ENV;

package/package.json

@@ -2,7 +2,7 @@
   "name": "@liquidcommercedev/rmn-sdk",
   "description": "LiquidCommerce RMN SDK",
   "author": "LiquidCommerce Tech",
-  "version": "1.4.6-beta.8",
+  "version": "1.5.0-beta.1",
   "homepage": "https://docs.liquidcommerce.co/rmn-sdk",
   "main": "./dist/index.cjs",
   "module": "./dist/index.esm.js",