export const version = "2.6.6"; enum ProductCardType { Recommendation = 0, SnakeRecommendation = 1, SearchResult = 2, ProductListingResult = 3, } type TrackingKey = "recommendation_id" | "search_result_id" | "product_listing_result_id"; /** * The Depict Queue function used to register events to be sent to depict. */ export type DepictQueue = { (eventName: EventName, ...args: unknown[]): void; send_event?: (eventName: EventName, ...args: unknown[]) => void; queue: [EventName, unknown][]; }; /** * Depict Object containing everything depict-related on the page. */ export interface DepictObject { eventHistory: [EventName, unknown][]; dpq: DepictQueue; dpc: DPC; } declare global { interface Window { /** * Lifted DPQ function for ease-of-use */ dpq: DepictQueue; depict: DepictObject; } } /** * Purchase format used by GA4 when sending a purchase event. * See https://developers.google.com/analytics/devguides/collection/ga4/ecommerce?client_type=gtag#make_a_purchase_or_issue_a_refund */ interface GA4Purchase { transaction_id: string; currency: string; items: GA4PurchaseItem[]; [additional: string]: unknown; } /** * Product format used by GA4 when sending a purchase event. * See https://developers.google.com/analytics/devguides/collection/ga4/reference/events?client_type=gtag#purchase_item */ interface GA4PurchaseItem { item_id: string; price: number; quantity: number; [additional: string]: unknown; } type EventName = "purchase" | "addToCart" | "setMarket" | "setProductId" | "setSessionId"; interface Options { /** * The initial market. Should be specified if the market is known at the point of intializing DPC. */ market?: string; /** * If we should observe for recommendations on creation. If false, you must call `trackRecommendationCard` manually. */ auto_observe?: boolean; } export class DPC { merchant: string; auto_observe: boolean; market?: string; /** Latest product_id found in the DOM. Used in a2c & pageview events on PDPs. */ latest_product_id?: string; /** The value of location.pathname when latest_product_id was set */ latest_product_id_path?: string; /** Latest session_id set on the client. Used for all events. */ latest_session_id?: string; constructor(merchant: string, options?: Options); tracked_elements: WeakSet; /** * Make sure the tracking is not set up twice on the same element. */ checkIfTracked(element: HTMLElement): boolean; /** * Adds click and impression tracking to a product card */ trackProductCard(card: HTMLElement, tracking_id: string, type: ProductCardType): void; /** * Adds tracking to an Add to cart button. */ trackAddToCartButton(button: HTMLElement, productCard?: HTMLElement): void; /** * Sends an Add to Cart Event to depict * If the add to cart unmistakably happened due to a click on a product card shown because of Depict (for example the add to cart button on a product card), set recommendation_id / search_result_id / product_listing_result_id (whatever applicable). If it happened on a PDP, set product_id instead. */ sendAddToCartEvent(data: { product_id?: string; } & { [x in TrackingKey]?: string }): void; /** * Sends a recommendation impression event to Depict */ sendRecommendationImpressionEvent(recommendation_id: string): void; /** * Sends a search result impression event to Depict */ sendSearchResultImpressionEvent(search_result_id: string): void; /** * Sends a product listing result impression event to Depict */ sendProductListingResultImpressionEvent(product_listing_result_id: string): void; /** * Sends a recommendation click event to Depict */ sendRecommendationClickEvent(recommendation_id: string): void; /** * Sends a search result click event to Depict */ sendSearchResultClickEvent(search_result_id: string): void; /** * Sends a product listing result click event to Depict */ sendProductListingResultClickEvent(product_listing_result_id: string): void; /** * Sends a Purchase Event to Depict */ sendPurchaseEvent(data: GA4Purchase): void; /** * Update the market used for tracking events */ setMarket(market: string): void; /** * Update the product_id used for add-to-cart and pageview events on PDPs. */ setProductId(product_id: string): void; /** * Set the current session_id. * * https://docs.depict.ai/docs/performance-client#browser-sessions */ setSessionId(session_id?: string | null): void; /** * Observe the DOM for recommendations to track */ observeRecommendations(): void; /** * Observe the dom for add to cart buttons. Used on product detail pages. */ observePDPA2CButton(): void; }