@depict-ai/ui 0.0.3 → 0.0.5

package/dist/index.d.ts

@@ -1,287 +1,14 @@
 import { Accessor, JSX, Setter, Signal } from "solid-js";
-import { SearchResponse } from "./typescript_schema/SearchResponse";
-import { SearchRequest } from "./typescript_schema/SearchRequest";
-import { BaseSearchRequest } from "./typescript_schema/BaseSearchRequest";
-import { SearchSuggestionsResponse } from "./typescript_schema/SearchSuggestionsResponse";
-import { SearchSuggestionsRequest } from "./typescript_schema/SearchSuggestionsRequest";
-import { ProductListingRequest } from "./typescript_schema/ProductListingRequest";
-import { ProductListingResponse, BaseCategoryDisplay } from "./typescript_schema/ProductListingResponse";
+import { Display, Node_Array, Elem, Extended_RR_Options, LayoutOptions, TwoLetterMarket } from "@depict-ai/utilishared";
+import { SearchResponse } from "@depict-ai/types/api/SearchResponse";
+import { SearchRequest, SearchFilter } from "@depict-ai/types/api/SearchRequest";
+import { BaseSearchRequest } from "@depict-ai/types/api/BaseSearchRequest";
+import { SearchSuggestionsResponse, CategorySuggestion } from "@depict-ai/types/api/SearchSuggestionsResponse";
+import { SearchSuggestionsRequest } from "@depict-ai/types/api/SearchSuggestionsRequest";
+import { ProductListingRequest } from "@depict-ai/types/api/ProductListingRequest";
+import { ProductListingResponse, BaseCategoryDisplay } from "@depict-ai/types/api/ProductListingResponse";
 import { JSX as _JSX1 } from "solid-js/types/jsx";
-import { SearchFilter } from "./typescript_schema/SearchRequest";
-import { CategorySuggestion } from "./typescript_schema/SearchSuggestionsResponse";
-declare function dlog(...args: any[]): void;
-type IPNS<T> = ((...values: T[]) => void) & AsyncIterable<T> & {
-    exit: () => void;
-    state: T | undefined;
-    latest_call_value: T | undefined;
-};
-declare const Sentry: {
-    captureException: (...args: any[]) => void;
-    captureMessage: (...args: any[]) => void;
-    withScope: (...args: any[]) => void;
-};
-declare global {
-    interface Window {
-        Cookiebot?: {
-            name: string;
-            consented: boolean;
-            declined: boolean;
-            changed: boolean;
-            hasResponse: boolean;
-            consentID: string;
-            consent: Consent;
-            isOutsideEU: boolean;
-            isOutOfRegion: boolean;
-            host: string;
-            domain: string;
-            currentPath: string;
-            doNotTrack: boolean;
-            consentLevel: string;
-            isRenewal: boolean;
-            forceShow: boolean;
-            dialog: null;
-            responseMode: string;
-            serial: string;
-            scriptId: string;
-            scriptElement: ScriptElement;
-            whitelist: any[];
-            cookieList: CookieList;
-            pathlist: any[];
-            userIsInPath: boolean;
-            cookieEnabled: boolean;
-            versionChecked: boolean;
-            versionRequested: boolean;
-            version: number;
-            latestVersion: number;
-            isNewVersion: boolean;
-            CDN: string;
-            source: string;
-            retryCounter: number;
-            frameRetryCounter: number;
-            bulkConsentFrameRetryCounter: number;
-            setOnloadFrameRetryCounter: number;
-            optOutLifetime: number;
-            consentLifetime: null;
-            framework: string;
-            hasFramework: boolean;
-            frameworkBlocked: boolean;
-            frameworkLoaded: boolean;
-            iframeReady: boolean;
-            iframe: Iframe;
-            bulkconsent: null;
-            bulkresetdomains: any[];
-            bulkconsentsubmitted: boolean;
-            isbulkrenewal: boolean;
-            wipe: Wipe;
-            consentUTC: Date;
-            IABConsentString: string;
-            GACMConsentString: string;
-            dataLayerName: string;
-            loaded: boolean;
-            autoblock: boolean;
-            mutationObserver: null;
-            mutationCounter: number;
-            mutationFallback: boolean;
-            mutationFallbackDocAttributes: any[];
-            mutationHandlerFallbackCharsetLoaded: boolean;
-            mutationAppName: string;
-            mutationEventListeners: any[];
-            mutationOnloadEventListeners: any[];
-            mutateEventListeners: boolean;
-            mutationHandlerFirstScript: null;
-            postPonedMutations: any[];
-            nonAsyncMutations: any[];
-            deferMutations: any[];
-            geoRegions: any[];
-            userCountry: string;
-            userCulture: string;
-            windowOnloadTriggered: boolean;
-            botDetectionDisabled: boolean;
-            regulations: Regulations;
-            regulationRegions: RegulationRegions;
-            commonTrackers: CommonTrackers;
-            configuration: Configuration;
-            inlineConfiguration: null;
-            processLinkClickCounter: number;
-            performanceEntriesCounter: number;
-            OverrideEventListenersOnloadFired: any[];
-            OverrideEventListenersOnloadToFire: any[];
-            fallbackScriptNodes: any[];
-            fallbackDeferNodes: any[];
-        };
-    }
-}
-declare global {
-    interface Document {
-        depictwashere: boolean;
-    }
-}
-type IdType = string | undefined | Promise<string | undefined>;
-interface Tenant<ProductId extends IdType> {
-    TENANT: string;
-    tenant: string;
-    MARKET: TwoLetterMarket;
-    market: TwoLetterMarket;
-    TYPE: string;
-    type: string;
-    GA_ID: string;
-    gaid: string;
-    get_product_id: (url?: string) => ProductId extends string | undefined ? string : Promise<string>;
-    product_id: (url?: string) => string | Promise<string>;
-    dataset: DOMStringMap;
-    modify: boolean;
-    is_debug: boolean;
-    debug: boolean;
-    dlog: typeof dlog;
-    Sentry: typeof Sentry;
-    catchify: <T extends Function>(fn: T) => T;
-    err: (...errors: any[]) => undefined;
-}
-/**
- * Tenant class. This describes which site/customer one is on, in which market, and some more information. It also sends the page_view event if not already done and highlights elements with a `.depict` class if `localStorage['highlight-depict']` is `"true"`
- * @param options  A object with constructor options
- */
-declare class Tenant<ProductId extends IdType = IdType> {
-    constructor(options: {
-        TENANT?: string;
-        TYPE?: string;
-        MARKET: TwoLetterMarket;
-        GA_ID: string;
-        get_product_id: (url?: string) => ProductId;
-        current_script_override?: HTMLScriptElement;
-        pageview_tracking?: boolean;
-    });
-}
-/**
- * This is a list of alpha-2 country codes plus some two letter combinations commonly used to describe markets
- */
-type TwoLetterMarket = "af" | "al" | "dz" | "as" | "ad" | "ao" | "ai" | "aq" | "ag" | "ar" | "am" | "aw" | "au" | "at" | "az" | "bs" | "bh" | "bd" | "bb" | "by" | "be" | "bz" | "bj" | "bm" | "bt" | "bo" | "bq" | "ba" | "bw" | "bv" | "br" | "io" | "bn" | "bg" | "bf" | "bi" | "cv" | "kh" | "cm" | "ca" | "ky" | "cf" | "td" | "cl" | "cn" | "cx" | "cc" | "co" | "km" | "cd" | "cg" | "ck" | "cr" | "hr" | "cu" | "cw" | "cy" | "cz" | "ci" | "dk" | "dj" | "dm" | "do" | "ec" | "eg" | "sv" | "gq" | "er" | "ee" | "sz" | "et" | "fk" | "fo" | "fj" | "fi" | "fr" | "gf" | "pf" | "tf" | "ga" | "gm" | "ge" | "de" | "gh" | "gi" | "gr" | "gl" | "gd" | "gp" | "gu" | "gt" | "gg" | "gn" | "gw" | "gy" | "ht" | "hm" | "va" | "hn" | "hk" | "hu" | "is" | "in" | "id" | "ir" | "iq" | "ie" | "im" | "il" | "it" | "jm" | "jp" | "je" | "jo" | "kz" | "ke" | "ki" | "kp" | "kr" | "kw" | "kg" | "la" | "lv" | "lb" | "ls" | "lr" | "ly" | "li" | "lt" | "lu" | "mo" | "mg" | "mw" | "my" | "mv" | "ml" | "mt" | "mh" | "mq" | "mr" | "mu" | "yt" | "mx" | "fm" | "md" | "mc" | "mn" | "me" | "ms" | "ma" | "mz" | "mm" | "na" | "nr" | "np" | "nl" | "nc" | "nz" | "ni" | "ne" | "ng" | "nu" | "nf" | "mp" | "no" | "om" | "pk" | "pw" | "ps" | "pa" | "pg" | "py" | "pe" | "ph" | "pn" | "pl" | "pt" | "pr" | "qa" | "mk" | "ro" | "ru" | "rw" | "re" | "bl" | "sh" | "kn" | "lc" | "mf" | "pm" | "vc" | "ws" | "sm" | "st" | "sa" | "sn" | "rs" | "sc" | "sl" | "sg" | "sx" | "sk" | "si" | "sb" | "so" | "za" | "gs" | "ss" | "es" | "lk" | "sd" | "sr" | "sj" | "se" | "ch" | "sy" | "tw" | "tj" | "tz" | "th" | "tl" | "tg" | "tk" | "to" | "tt" | "tn" | "tr" | "tm" | "tc" | "tv" | "ug" | "ua" | "ae" | "gb" | "um" | "us" | "uy" | "uz" | "vu" | "ve" | "vn" | "vg" | "vi" | "wf" | "eh" | "ye" | "zm" | "zw" | "ax" | "uk" | "en" | "da" | "eu" | "sv" | "oc" | "nb" | "sq";
-type ExclusiveId = {
-    category_id: string;
-    product_id?: undefined;
-    product_ids?: undefined;
-} | {
-    category_id?: undefined;
-    product_id: string;
-    product_ids?: undefined;
-} | {
-    category_id?: undefined;
-    product_id?: undefined;
-    product_ids: string[];
-} | {
-    category_id?: undefined;
-    product_id?: undefined;
-    product_ids?: undefined;
-};
-type FetchRecsOptions = {
-    type: string;
-} & ExclusiveId;
-declare class InfoForProcessing {
-    constructor(t: Tenant, rendering_options: RR_Options, displays: Display[], index?: number, remove_display?: () => void, event_listeners?: [
-        type: keyof HTMLElementEventMap,
-        listener: (this: HTMLElement, ev: HTMLElementEventMap[keyof HTMLElementEventMap]) => any,
-        options?: boolean | AddEventListenerOptions
-    ][]);
-}
-type RegisterEventListener = (type: keyof HTMLElementEventMap, listener: (this: HTMLElement, ev: HTMLElementEventMap[keyof HTMLElementEventMap]) => any, options?: boolean | AddEventListenerOptions) => void;
-interface InfoForProcessing {
-    t: Tenant;
-    rendering_options: RR_Options;
-    displays: Display[];
-    index: number;
-    remove_display?: () => void;
-    register_event_listener: RegisterEventListener;
-    event_listeners?: [
-        type: keyof HTMLElementEventMap,
-        listener: (this: HTMLElement, ev: HTMLElementEventMap[keyof HTMLElementEventMap]) => any,
-        options?: boolean | AddEventListenerOptions
-    ][];
-    extras?: {
-        [key: string]: any;
-    };
-}
-type RR_PreProcessor = (display: Display, info: InfoForProcessing) => Promise<Display> | Display;
-type RR_PostProcessor = (elements: NodeListOf<ChildNode> | Node_Array, display: Display, info: InfoForProcessing) => Promise<NodeListOf<ChildNode> | Node_Array> | NodeListOf<ChildNode> | Node_Array;
-type RR_Options = {
-    template: string | ((arg0: Display, info: InfoForProcessing) => Promise<string | Node_Array> | string | Node_Array);
-    recs?: Display[] | undefined | Promise<Display[] | undefined>;
-    type: string;
-    min_items_to_report?: number;
-    min_items_to_run?: number;
-    max_items?: number;
-    extra_api_options?: {
-        [key: string]: any;
-    };
-    pre_processors?: RR_PreProcessor[];
-    post_processors?: RR_PostProcessor[];
-    headers?: HeadersInit;
-} & FetchRecsOptions;
-interface Display {
-    page_url: string;
-    image_url: string;
-    sale_price: number;
-    original_price: number;
-    product_id: string;
-    ga_product_id?: string;
-    ga_product_ids?: string[];
-    variant_ids?: string[];
-    recommendation_id: string;
-    title: string;
-    search_result_id?: string;
-    [key: string]: any;
-}
-type Node_Array = (Element | Text | Comment)[];
-type Extended_RR_Options = {
-    view_tracking?: RR_PostProcessor[];
-    click_tracking?: RR_PostProcessor[];
-} & RR_Options;
-declare global {
-    interface HTMLImageElementWithLoaded extends HTMLImageElement {
-        loaded?: boolean;
-    }
-    interface HTMLSourceElementWithLoaded extends HTMLSourceElement {
-        loaded?: boolean;
-    }
-}
-declare global {
-    interface Document {
-        _depict_modify: boolean | undefined;
-    }
-}
-type Elem = Node | string;
-/** Overrides that can specify a different amount of columns for certain rows
- * @param key The row (starts at 1) that you're "selecting" to override
- * @param value The amount of columns that your selected row should have
- */
-type Override = {
-    overrides: Record</* Row: */ number, /* Column: */ number>;
-};
-type ColAtSize = /** [ <number of columns>, <max-width>, <min-width>, <spacing> ] */ readonly [number, null, string, string | null] | readonly [number, string, string, null, Override] | readonly [number, string, null, string | null] | readonly [number, string, string, string | null] | readonly [number, string, null] | readonly [number, string, string] | readonly [number, null, string] | readonly [number, string];
-type ColsAtSize = readonly ColAtSize[];
-type LayoutOptions = {
-    container_element: Element;
-    cols_at_size: ColsAtSize;
-    grid_spacing: string;
-    rows: {
-        start_rows?: number;
-        rows_per_click?: number;
-        ipns?: IPNS<number>;
-        max_rows?: number;
-        button?: HTMLElement;
-    } | "all";
-    layout: "slider" | "grid";
-    disable_partial_rows?: boolean;
-    override_vertical_spacing?: string;
-};
-declare global {
-    interface Window {
-        ShopifyAnalytics: {
-            meta?: {
-                product?: ShopifyMetaProduct;
-            };
-        };
-    }
-}
+import { InfoForProcessing } from "@depict-ai/utilishared/src";
 export const CategoryTitle: ({ category_title_, product_count_, }: {
     category_title_: Accessor<string | undefined>;
     product_count_: JSX.Element;
@@ -1449,7 +1176,6 @@ export interface category_i18n extends plp_shared_i18n {
     quicklinks_aria_label_: Accessor<string>;
     breadcrumbs_separator_: Accessor<string>;
 }
-type AlternativeQuerySubmitterForSPAs = (search_param_name: string, new_search_query: string, url_transformer?: (url_object: URL) => unknown) => unknown;
 export type WithRequired<T, K extends keyof T> = T & {
     [P in K]-?: T[P];
 };
@@ -1471,6 +1197,9 @@ type ConstructorOptions = {
     rr_options_: Omit<Extended_RR_Options, "type" | "recs" | "category_id" | "product_id" | "product_ids">;
     get_product_id_: (url?: string) => string | Promise<string>;
 };
+/**
+ * TODO: this is not yet the SDK, we still have to change this to conform to the SDK docs
+ */
 export class Category {
     #private;
     constructor(opts: ConstructorOptions);
@@ -1496,72 +1225,59 @@ export type RenderCategorySuggestion = (category_suggestion: Accessor<CategorySu
     op: WithRequired<SearchFilter, "op">["op"];
     data: WithRequired<SearchFilter, "data">["data"];
 }[]>) => JSX.Element;
-declare function QueryInput({ search_field_value_, input_field_ref_, submit_query_, override_on_enter_, clear_filters_, disabled_, on_back_, i18n_, }: {
-    search_query_: Signal<string>;
-    search_field_value_: Signal<string>;
-    input_field_ref_?: (el: HTMLInputElement) => any;
-    disabled_?: boolean;
-    override_on_enter_?: (e: KeyboardEvent) => true | false | undefined;
-    submit_query_: VoidFunction;
-    clear_filters_: VoidFunction;
-    on_back_?: VoidFunction;
-    i18n_: search_i18n;
-}): HTMLDivElement;
+type SDKColsAtSize = [number, number?][];
 type _ConstructorOptions1 = {
-    search_page_: {
-        append_instead_of_replace_?: boolean;
-        include_input_field_?: boolean | {
-            on_open_?: VoidFunction;
-            on_close_?: VoidFunction;
-        };
-        page_title_?: string;
-        is_search_page_: (url: URL) => boolean;
-        slider_arrow_button_: SVGElement | HTMLElement;
-        search_query_param_name_?: string;
-        selector_for_page_to_replace_: string;
-        make_category_suggestion_card_: RenderCategorySuggestion | false;
-        wrap_search_page_?: (search_page_elements: Node_Array) => Node_Array;
-        rr_options_: Omit<Extended_RR_Options, "type" | "recs" | "category_id" | "product_id" | "product_ids">;
-        recommendations_rr_options_?: _ConstructorOptions1["search_page_"]["rr_options_"];
-        layout_options_: Omit<LayoutOptions, "container_element" | "layout" | "rows">;
-        recommendations_layout_options_?: _ConstructorOptions1["search_page_"]["layout_options_"];
-        search_recs_view_more_?: boolean;
-        get_product_id_: (url?: string) => string | Promise<string>;
-    };
-    page_replacer_ref_: (pr: PageReplacer) => void;
-    depict_api_: DepictAPI;
-    url_transformer_: ((url_object: URL) => unknown) | undefined;
-    alternative_query_submitter_for_spas_?: AlternativeQuerySubmitterForSPAs;
-    modal_options_: {
-        render_instant_card_: (display: Accessor<Display>, index: number, get_fake_rendering_options: Accessor<RR_Options>, i18n_: search_i18n) => _JSX1.Element;
-        render_instant_card_placeholder_: () => HTMLElement;
-        bottom_distance_under_modal_?: Accessor<number | undefined>;
-        disable_scrolling_?: boolean;
+    search_query_url_param_name?: string;
+    market: string;
+    merchant: string;
+    localization: {
+        [K in keyof search_i18n]: ReturnType<search_i18n[K]>;
     };
-    /** Should category suggestions be included in SearchModal and SearchPage? Defaults to true */
-    enable_category_suggestions_?: boolean;
+    on_navigation?: (href: string) => unknown;
+    url_transformer?: (url_object: URL) => unknown;
+    enable_category_suggestions?: boolean;
 };
-export class Search {
+type OpenModalArguments = [
+    options_for_modal?: {
+        style_props_?: Signal<_JSX1.CSSProperties>;
+        closing_animation_?: () => Promise<any>;
+        class_list_?: Accessor<Record<string, boolean>>;
+    },
+    on_dispose?: VoidFunction
+];
+type SDKGridSpacing = string | {
+    horizontal: string;
+    vertical: string;
+};
+export const get_search_query_updating_blocked_signal: (depict_search: DepictSearch) => Signal<boolean> | undefined;
+export class DepictSearch {
     #private;
-    constructor(opts: _ConstructorOptions1);
-    get locale_(): {
+    constructor({ search_query_url_param_name, url_transformer, on_navigation, enable_category_suggestions, ...props_on_class }: _ConstructorOptions1);
+    get localization(): {
         [K in keyof search_i18n]: ReturnType<search_i18n[K]>;
     };
-    set locale_(locale_obj: {
+    set localization(locale_obj: {
         [K in keyof search_i18n]: ReturnType<search_i18n[K]>;
     });
-    get readonly_modal_open_(): boolean;
-    get tenant_(): string;
-    set tenant_(tenant: string);
-    get market_(): TwoLetterMarket;
-    set market_(market: TwoLetterMarket);
-    get boot_(): () => Promise<{
-        readonly close_modal_: VoidFunction;
-        readonly open_modal_: (arg0: {
-            style_props_?: Signal<_JSX1.CSSProperties> | undefined;
-            closing_animation_?: (() => Promise<any>) | undefined;
-            class_list_?: Accessor<Record<string, boolean>> | undefined;
-        }, on_dispose?: VoidFunction | undefined) => void;
-    }>;
-    get get_query_input(): (opts?: Omit<Partial<Parameters<typeof QueryInput>[0]>, "clear_filters_" | "search_query_" | "submit_query_" | "i18n_" | "search_field_value_">) => HTMLDivElement;
+    get modal_open(): OpenModalArguments | boolean;
+    set modal_open(new_state: OpenModalArguments | boolean);
+    get merchant(): string;
+    set merchant(tenant: string);
+    get market(): string;
+    set market(market: string);
 }
+export function SearchPage({ depict_search, include_input_field, grid_spacing, cols_at_size, product_card_template, get_product_id, }: {
+    depict_search: DepictSearch;
+    include_input_field?: boolean | {
+        on_open_?: VoidFunction;
+        on_close_?: VoidFunction;
+    };
+    grid_spacing: SDKGridSpacing;
+    cols_at_size: SDKColsAtSize;
+    product_card_template: (display: Display, info: InfoForProcessing) => Promise<Node_Array> | Node_Array;
+    get_product_id: (url?: string) => string | Promise<string>;
+}): Node_Array;
+export function SearchField({ depict_search, modal_dispose_handler, }: {
+    depict_search: DepictSearch;
+    modal_dispose_handler?: VoidFunction;
+}): Node_Array;