@adhese/sdk 0.15.0 → 0.16.1

package/dist/index.d.ts

@@ -3,6 +3,223 @@ import { Ref, Merge, MaybeRef, UrlString, EventManager } from '@adhese/sdk-share
 import * as zod from 'zod';
 import { TypeOf, ZodType } from 'zod';
 
+declare function createAsyncHook<Argument = void, Callback extends (arg: Argument) => Argument | void | Promise<Argument | void> = (arg: Argument) => Argument | void | Promise<Argument | void>>(name: string, { onRun, onAdd, }?: {
+    onRun?(callbacks?: Set<Callback>): void;
+    onAdd?(callbacks?: Set<Callback>): void;
+}): [
+    run: (arg: Argument) => Promise<Argument>,
+    add: (callback: Callback) => () => void,
+    dispose: () => void
+];
+declare function createPassiveHook<Argument = void, Callback extends (arg: Argument) => void | Promise<void> = (arg: Argument) => void | Promise<void>>(name: string, { onRun, onAdd, }?: {
+    onRun?(callbacks?: Set<Callback>): void;
+    onAdd?(callbacks?: Set<Callback>): void;
+}): [
+    run: (arg: Argument) => void,
+    add: (callback: Callback) => () => void,
+    dispose: () => void
+];
+
+type RenderMode = 'iframe' | 'inline' | 'none';
+type SlotHooks = {
+    /**
+     * Hook that is called when the format of the slot changes.
+     */
+    onBeforeRender: ReturnType<typeof createAsyncHook<AdheseAd>>[1];
+    /**
+     * Hook that is called when the slot is rendered.
+     */
+    onRender: ReturnType<typeof createAsyncHook<AdheseAd>>[1];
+    /**
+     * Hook that is called before the slot is requested from the server.
+     */
+    onBeforeRequest: ReturnType<typeof createAsyncHook<AdheseAd | null>>[1];
+    /**
+     * Hook that is called when the slot is requested from the server.
+     */
+    onRequest: ReturnType<typeof createAsyncHook<AdheseAd>>[1];
+    /**
+     * Hook that is called when the slot is disposed.
+     */
+    onDispose: ReturnType<typeof createPassiveHook>[1];
+};
+type AdheseSlotOptions = {
+    /**
+     * The format code of the slot. Used to find the correct element on the page to render the ad in. If the format is a
+     * string, it is used as the format code. If the format is an array, the format code is determined by the query
+     * detector.
+     */
+    format: string | ReadonlyArray<{
+        format: string;
+        query: string;
+    }>;
+    /**
+     * Type of the slot. On its own has no effect, but can be used by plugins to create different behavior for different
+     * types of slots.
+     */
+    type?: string;
+    /**
+     * If we have multiple slots with the same format, we can use this to differentiate between them.
+     */
+    slot?: string;
+    /**
+     * The element that contains the slot. Used to find the correct element on the page to render the ad in.
+     */
+    containingElement?: string | HTMLElement;
+    /**
+     * The parameters that are used to render the ad.
+     */
+    parameters?: Record<string, ReadonlyArray<string> | string>;
+    /**
+     * The Adhese context
+     */
+    context: AdheseContext;
+    /**
+     * The render mode of the slot.
+     *
+     * - `iframe`: The ad will be rendered in an iframe.
+     * - `inline`: The ad will be rendered in the containing element.
+     *
+     * @default 'iframe'
+     */
+    renderMode?: RenderMode;
+    /**
+     * Special callback that is run when the slot is initialized. It passes the slot context ref object and a special
+     * plugin object that contains a set of hooks you can use to hook into different moments of the slots lifecycle.
+     */
+    setup?(context: Ref<AdheseSlot | null>, hooks: SlotHooks): void;
+} & ({
+    /**
+     * If the slot should be lazy loaded. This means that the ad will only be requested when the slot is in the viewport.
+     * If `true`, the slot will handle the request itself and render the ad.
+     */
+    lazyLoading: true;
+    lazyLoadingOptions?: {
+        /**
+         * The root margin of the intersection observer. This is used to determine when the slot is in the viewport.
+         */
+        rootMargin?: string;
+    };
+} | {
+    lazyLoading?: false;
+    lazyLoadingOptions?: never;
+});
+type AdheseSlot = Merge<Omit<AdheseSlotOptions, 'onDispose' | 'context' | 'onFormatChange' | 'format'>, SlotHooks & {
+    /**
+     * Type of the slot. On its own has no effect, but can be used by plugins to create different behavior for different
+     * types of slots.
+     */
+    readonly type?: string;
+    /**
+     * The name of the slot. This is used to identify the slot in the Adhese instance.
+     *
+     * The name is generated based on the location, format, and slot of the slot.
+     */
+    readonly name: string;
+    /**
+     * The format code of the slot. Used to find the correct element on the page to render the ad in.
+     *
+     * If the format is a string, it is used as the format code. If the format is an array, the format code is determined
+     * by the query detector.
+     *
+     * When you change the format, the slot will request a new ad from the API automatically.
+     */
+    readonly format: string;
+    /**
+     * The location of the slot. This is the location that is used to determine the current page URL.
+     */
+    readonly location: string;
+    /**
+     * The parameters that are used to render the ad.
+     */
+    parameters: Map<string, ReadonlyArray<string> | string>;
+    /**
+     * Whether the viewability tracking pixel has been fired.
+     */
+    readonly isViewabilityTracked: boolean;
+    /**
+     * Whether the impression tracking pixel has been fired.
+     */
+    readonly isImpressionTracked: boolean;
+    /**
+     * The state of the slot is currently in.
+     *
+     * - `initializing`: The slot is initializing.
+     * - `initialized`: The slot is initialized.
+     * - `loading`: The slot is loading data from the API
+     * - `loaded`: The slot has loaded data from the API and is ready to render
+     * - `empty`: The slot has loaded data from the API but the response was empty
+     * - `rendering`: The slot is rendering the ad
+     * - `rendered`: The slot has rendered the ad
+     * - `error`: The slot has encountered an error
+     */
+    readonly status: 'initializing' | 'initialized' | 'loading' | 'loaded' | 'empty' | 'rendering' | 'rendered' | 'error';
+    /**
+     * Is the slot disposed.
+     */
+    readonly isDisposed: boolean;
+    /**
+     * The element that contains the slot.
+     */
+    readonly element: HTMLElement | null;
+    /**
+     * Unique identifier of the slot. ID is generated on initialization and will never change.
+     */
+    readonly id: string;
+    /**
+     * Slot related data fetched from the API.
+     */
+    data: AdheseAd | null;
+    /**
+     * Renders the slot in the containing element. If no data is provided, new data will be requested from the API.
+     */
+    render(data?: AdheseAd): Promise<HTMLElement | null>;
+    /**
+     * Requests a new ad from the API and returns the ad object.
+     */
+    request(): Promise<AdheseAd | null>;
+    /**
+     * Remove the HTML element contents from the dom.
+     */
+    cleanElement(): void;
+    /**
+     * Removes the slot from the DOM and cleans up the slot instance.
+     */
+    dispose(): void;
+}>;
+
+type AdheseSlotManager = {
+    /**
+     * Returns all slots that are currently registered and rendered.
+     */
+    getAll(): ReadonlyArray<AdheseSlot>;
+    /**
+     * Adds a new slot to the Adhese instance and renders it.
+     */
+    add(slot: Omit<AdheseSlotOptions, 'context'>): Readonly<AdheseSlot>;
+    /**
+     * Finds all slots in the DOM and adds them to the Adhese instance.
+     */
+    findDomSlots(): Promise<ReadonlyArray<AdheseSlot>>;
+    /**
+     * Returns the slot with the given name.
+     */
+    get(name: string): AdheseSlot | undefined;
+    /**
+     * Removes all slots from the Adhese instance and cleans up the slot manager.
+     */
+    dispose(): void;
+};
+type SlotManagerOptions = {
+    /**
+     * List of initial slots to add to the slot manager.
+     */
+    initialSlots?: ReadonlyArray<Merge<Omit<AdheseSlotOptions, 'containingElement' | 'context' | 'lazy'>, {
+        containingElement: string;
+    }>>;
+    context: AdheseContext;
+};
+
 declare const baseSchema: zod.ZodObject<{
     adDuration: zod.ZodOptional<zod.ZodEffects<zod.ZodUnion<[zod.ZodString, zod.ZodLiteral<"">]>, number | undefined, string>>;
     adFormat: zod.ZodOptional<zod.ZodString>;
@@ -67,6 +284,7 @@ declare const baseSchema: zod.ZodObject<{
     origin: "JERLICIA" | "DALE";
     slotID: string;
     slotName: string;
+    body?: string | Record<string, unknown> | readonly unknown[] | undefined;
     adDuration?: number | undefined;
     adFormat?: string | undefined;
     additionalCreativeTracker?: URL | undefined;
@@ -78,7 +296,6 @@ declare const baseSchema: zod.ZodObject<{
     advertiserId?: string | undefined;
     altText?: string | undefined;
     auctionable?: boolean | "" | undefined;
-    body?: string | Record<string, unknown> | readonly unknown[] | undefined;
     clickTag?: URL | undefined;
     comment?: string | undefined;
     creativeName?: string | undefined;
@@ -119,6 +336,7 @@ declare const baseSchema: zod.ZodObject<{
     origin: "JERLICIA" | "DALE";
     slotID: string;
     slotName: string;
+    body?: string | undefined;
     adDuration?: string | undefined;
     adFormat?: string | undefined;
     additionalCreativeTracker?: string | undefined;
@@ -130,7 +348,6 @@ declare const baseSchema: zod.ZodObject<{
     advertiserId?: string | undefined;
     altText?: string | undefined;
     auctionable?: boolean | "" | undefined;
-    body?: string | undefined;
     clickTag?: string | undefined;
     comment?: string | undefined;
     creativeName?: string | undefined;
@@ -177,222 +394,6 @@ type AdheseAd<T = string | Record<string, unknown> | ReadonlyArray<unknown>> = O
     tag: T | string;
 };
 
-declare function createAsyncHook<Argument = void, Callback extends (() => void | Promise<void>) | ((arg: Argument) => Argument | void | Promise<Argument | void>) = Argument extends void ? () => void | Promise<void> : (arg: Argument) => Argument | void | Promise<Argument | void>>(name: string, { onRun, onAdd, }?: {
-    onRun?(callbacks?: Set<Callback>): void;
-    onAdd?(callbacks?: Set<Callback>): void;
-}): [
-    run: Argument extends void ? () => Promise<void> : (arg: Argument) => Promise<Argument>,
-    add: (callback: Callback) => () => void,
-    dispose: () => void
-];
-declare function createPassiveHook<Argument = void, Callback extends (arg: Argument) => void | Promise<void> = (arg: Argument) => void | Promise<void>>(name: string, { onRun, onAdd, }?: {
-    onRun?(callbacks?: Set<Callback>): void;
-    onAdd?(callbacks?: Set<Callback>): void;
-}): [
-    run: (arg: Argument) => void,
-    add: (callback: Callback) => () => void,
-    dispose: () => void
-];
-
-type RenderMode = 'iframe' | 'inline' | 'none';
-type AdheseSlotOptions = {
-    /**
-     * The format code of the slot. Used to find the correct element on the page to render the ad in. If the format is a
-     * string, it is used as the format code. If the format is an array, the format code is determined by the query
-     * detector.
-     */
-    format: string | ReadonlyArray<{
-        format: string;
-        query: string;
-    }>;
-    /**
-     * If we have multiple slots with the same format, we can use this to differentiate between them.
-     */
-    slot?: string;
-    /**
-     * The element that contains the slot. Used to find the correct element on the page to render the ad in.
-     */
-    containingElement?: string | HTMLElement;
-    /**
-     * The parameters that are used to render the ad.
-     */
-    parameters?: Record<string, ReadonlyArray<string> | string>;
-    /**
-     * The Adhese context
-     */
-    context: AdheseContext;
-    /**
-     * The render mode of the slot.
-     *
-     * - `iframe`: The ad will be rendered in an iframe.
-     * - `inline`: The ad will be rendered in the containing element.
-     *
-     * @default 'iframe'
-     */
-    renderMode?: RenderMode;
-    /**
-     * Callback that is called when the slot is disposed.
-     */
-    onDispose?(): void;
-    /**
-     * Callback that is called when the slot is rendered.
-     */
-    onRender?(element: HTMLElement): void;
-    /**
-     * Callback that is called before the ad is rendered. This can be used to modify the ad before it is rendered.
-     * Particularly useful for rendering ads with custom HTML if the ad tag contains a JSON object.
-     */
-    onBeforeRender?(ad: AdheseAd): AdheseAd | void;
-    /**
-     * Callback that is called when the viewability of the slot changes.
-     */
-    onViewabilityChanged?(isViewable: boolean): void;
-    /**
-     * Callback that is called when the request for the slot returns an empty response. This can happen for multiple
-     * reasons, for example when the slot is not sold to a buyer.
-     */
-    onEmpty?(): void;
-    /**
-     * Special callback that is run when the slot is initialized. It passes the slot context ref object and a special
-     * plugin object that contains a set of hooks you can use to hook into different moments of the slots lifecycle.
-     */
-    setup?(context: Ref<AdheseSlot | null>, plugin: {
-        /**
-         * Hook that is called when the slot is rendered.
-         */
-        onRender: ReturnType<typeof createAsyncHook<AdheseAd>>[1];
-        /**
-         * Hook that is called when the slot is requested from the server.
-         */
-        onRequest: ReturnType<typeof createAsyncHook<void>>[1];
-        /**
-         * Hook that is called when the slot is disposed.
-         */
-        onDispose: ReturnType<typeof createPassiveHook>[1];
-    }): void;
-} & ({
-    /**
-     * If the slot should be lazy loaded. This means that the ad will only be requested when the slot is in the viewport.
-     * If `true`, the slot will handle the request itself and render the ad.
-     */
-    lazyLoading: true;
-    lazyLoadingOptions?: {
-        /**
-         * The root margin of the intersection observer. This is used to determine when the slot is in the viewport.
-         */
-        rootMargin?: string;
-    };
-} | {
-    lazyLoading?: false;
-    lazyLoadingOptions?: never;
-});
-type AdheseSlot = Merge<Omit<AdheseSlotOptions, 'onDispose' | 'context' | 'onFormatChange' | 'format' | 'setup'>, {
-    /**
-     * The name of the slot. This is used to identify the slot in the Adhese instance.
-     *
-     * The name is generated based on the location, format, and slot of the slot.
-     */
-    readonly name: string;
-    /**
-     * The format code of the slot. Used to find the correct element on the page to render the ad in.
-     *
-     * If the format is a string, it is used as the format code. If the format is an array, the format code is determined
-     * by the query detector.
-     *
-     * When you change the format, the slot will request a new ad from the API automatically.
-     */
-    readonly format: string;
-    /**
-     * The location of the slot. This is the location that is used to determine the current page URL.
-     */
-    readonly location: string;
-    /**
-     * The parameters that are used to render the ad.
-     */
-    parameters: Map<string, ReadonlyArray<string> | string>;
-    /**
-     * Whether the viewability tracking pixel has been fired.
-     */
-    readonly isViewabilityTracked: boolean;
-    /**
-     * Whether the impression tracking pixel has been fired.
-     */
-    readonly isImpressionTracked: boolean;
-    /**
-     * Ad object that is fetched from the API.
-     */
-    ad: AdheseAd | null;
-    /**
-     * The state of the slot is currently in.
-     *
-     * - `initializing`: The slot is initializing.
-     * - `initialized`: The slot is initialized.
-     * - `loading`: The slot is loading data from the API
-     * - `loaded`: The slot has loaded data from the API and is ready to render
-     * - `empty`: The slot has loaded data from the API but the response was empty
-     * - `rendering`: The slot is rendering the ad
-     * - `rendered`: The slot has rendered the ad
-     * - `error`: The slot has encountered an error
-     */
-    readonly status: 'initializing' | 'initialized' | 'loading' | 'loaded' | 'empty' | 'rendering' | 'rendered' | 'error';
-    /**
-     * Is the slot disposed.
-     */
-    readonly isDisposed: boolean;
-    /**
-     * The element that contains the slot.
-     */
-    readonly element: HTMLElement | null;
-    /**
-     * Unique identifier of the slot. ID is generated on initialization and will never change.
-     */
-    readonly id: string;
-    /**
-     * Renders the slot in the containing element. If no ad is provided, a new ad will be requested from the API.
-     */
-    render(ad?: AdheseAd): Promise<HTMLElement | null>;
-    /**
-     * Requests a new ad from the API and returns the ad object.
-     */
-    request(): Promise<AdheseAd | null>;
-    /**
-     * Removes the slot from the DOM and cleans up the slot instance.
-     */
-    dispose(): void;
-}>;
-
-type AdheseSlotManager = {
-    /**
-     * Returns all slots that are currently registered and rendered.
-     */
-    getAll(): ReadonlyArray<AdheseSlot>;
-    /**
-     * Adds a new slot to the Adhese instance and renders it.
-     */
-    add(slot: Omit<AdheseSlotOptions, 'context'>): Readonly<AdheseSlot>;
-    /**
-     * Finds all slots in the DOM and adds them to the Adhese instance.
-     */
-    findDomSlots(): Promise<ReadonlyArray<AdheseSlot>>;
-    /**
-     * Returns the slot with the given name.
-     */
-    get(name: string): AdheseSlot | undefined;
-    /**
-     * Removes all slots from the Adhese instance and cleans up the slot manager.
-     */
-    dispose(): void;
-};
-type SlotManagerOptions = {
-    /**
-     * List of initial slots to add to the slot manager.
-     */
-    initialSlots?: ReadonlyArray<Merge<Omit<AdheseSlotOptions, 'containingElement' | 'context' | 'lazy'>, {
-        containingElement: string;
-    }>>;
-    context: AdheseContext;
-};
-
 type AdRequestOptions = {
     /**
      * Slot you want to fetch the ad for
@@ -593,6 +594,10 @@ type BaseAdhese = {
      * Is the instance disposed
      */
     isDisposed: boolean;
+    /**
+     * Active media query device
+     */
+    device: string;
     /**
      * Get a slot by name.
      * @param name The name of the slot.
@@ -617,7 +622,7 @@ type BaseAdhese = {
      */
     dispose(): void;
 };
-type ReadonlyProps = 'options' | 'isDisposed' | 'logger' | 'events' | 'get' | 'getAll' | 'addSlot' | 'findDomSlots' | 'dispose' | 'slots';
+type ReadonlyProps = 'options' | 'isDisposed' | 'logger' | 'events' | 'get' | 'getAll' | 'addSlot' | 'findDomSlots' | 'dispose' | 'slots' | 'device';
 type Adhese = Omit<BaseAdhese, ReadonlyProps> & Readonly<Pick<BaseAdhese, ReadonlyProps>>;
 type AdheseContextState = Omit<BaseAdhese, 'options'> & {
     readonly options: MergedOptions;