export * from "./adaptors"; export type Awaitable = Promise | T; export declare namespace Core { type RenderMode = "3D" | "2D" | "2D_Parallax"; type Gender = "Male" | "Female"; type AssetInfo = string | { [key: string]: string | { blob: string; }; }; type AssetType = "Avatar" | "Scene" | "Garment" | "Animation"; } export declare namespace Providers { /** * Provides the available ids as well as the asset bundles for a specific resource type. */ interface AssetProvider { /** * Returns a list of ids for the available resources for this provider. */ getIds(): Awaitable>; /** * Returns the asset bundle for a specific resource * @param id Unique ID if the garment as used in your systems */ getById(id: string): Awaitable; } /** * Provides information about the garments in the dressing room */ export interface GarmentProvider extends AssetProvider { /** * Return the display name of a garment as string. This will be shown for example below * the garment tile and in the details drawer. * @param id Unique ID if the garment as used in your systems */ getName(id: string): Awaitable; /** * Returns an url to the thumbnail image of a garment. This will be shown for example below * the garment tile and in the details drawer. */ getThumbnail(id: string): Awaitable; /** * Removes the given garment from the dressing room. * Is called when someone clicks "Remove from dressing room" on a garment tile. * @param id Unique ID if the garment as used in your systems */ removeById(id: string): Awaitable; /** * Callback to add a garments from a shared look into the current dressing room / garment provider. * @param id Unique ID if the garment as used in your systems * */ addById?: (id: string) => void; } /** * Provides information & assets for the avatars available in the dressing room. */ export interface AvatarProvider extends AssetProvider { /** * Returns the display name of the avatar as string. This will be shown in the avatar selection drawer. * @param id Unique ID of the avatar */ getName(id: string): Awaitable; /** * Returns an url to the thumbail image of the avatar. This will be shown in the avater selection drawer. * Thumbnails should ideally be square. * @param id Unique ID of the avatar */ getThumbnail(id: string): Awaitable; /** * Returns the gender of an avatar as enum. * @param id Unique ID of the avatar */ getGender(id: string): Awaitable; } /** * Provides information & assest for the scenes available in the dressing room. */ export interface SceneProvider extends AssetProvider { /** * Returns the display name of the scene as string. This will be shown in the scene selection drawer. * @param id Unique ID of the scene */ getName(id: string): Awaitable; /** * Returns an url to the thumbail image for the scene. This will be shown in the scene selection drawer. * Thumbnails should ideally be square. * @param id */ getThumbnail(id: string): Awaitable; } export interface AnimationProvider extends AssetProvider { getName(id: string): Awaitable; } export {}; } /** * Namespace for commerce related providers */ export declare namespace Commerce { /** * Provides information for commerce related fields. */ interface CommerceProvider { /** * Returns the currency for a given garment. * @param id Unique ID of the garment */ getCurrencyForId(id: string): Awaitable; /** * Returns the price of a given garment. * @param id Unique ID of the garment */ getPriceForId(id: string): Awaitable; } } /** * Namespace for recommendation related providers. */ export declare namespace Recommendations { /** * Provider for product recommendations */ interface RecommendedProductsProvider { /** * Returns a list of garment ids which should be shown as recommended in the dressing room */ getGarmentIds(): Awaitable>; } } /** * Namespace for mannequin creation related providers */ export declare namespace MannequinCreation { /** * Provider for custom mannequins. The methods defined by this interface are used to store the * data for the avatar. How you store the data is completely up to you. */ interface MutableAvatarProvider extends Providers.AvatarProvider { /** * Deletes the avatar with the given id * @param id Unique ID auf the avatar */ deleteById(id: string): Awaitable; /** * Stores the avatar's assets persistently for the given ID. How you actually store them is up to you. * @param id Unique ID of the avatar * @param asset Asset container object */ storeById(id: string, asset: Core.AssetInfo): Awaitable; /** * Sets the name for the avatar with the given ID. * @param id Unique ID of the avatar * @param name Name of the avatar */ setName(id: string, name: string): Awaitable; /** * Sets the gender of the avatar with the given ID. * @param id Unique ID of the avatar * @param gender Genderof the avatar */ setGender(id: string, gender: Core.Gender): Awaitable; /** * Sets the thumbnail for the avatar encoded as base64 string. * @param id Unique ID of the avatar * @param thumbnail Thumbnail png in base64 format */ setThumbnail(id: string, thumbnail: string): Awaitable; } } /** * Provider for inventory & stock related functionality. */ export declare namespace Inventory { /** * Type for cart item objects */ type CartItem = { /** * Unique ID */ id: string; /** * Size Identifier */ sizeId: ItemSize["id"]; /** * Quantity */ qty: number; }; type Cart = Array; /** * Type for item sizes */ type ItemSize = { /** * Identifier for the size */ id: string; /** * Text for displaying the size */ label: string; }; /** * Provider for inventory and cart related functionality. All functionality refers to your e-commerce solution. * E.g. The qtyInCard method should return the quantity of a specific garment in the shopping cart or 0 if not there. */ interface InventoryProvider { /** * Returns the quantity of the garment with the given ID and size. This refers to the shopping cart * @param id Unique ID of the garment * @param sizeId Size identifier of the garment */ qtyInCard(id: string, sizeId: string): Awaitable; /** * Adds a list of items to the shopping cart * @param items Array of CartItem objects containing the ID, size and quantity of the products */ addToCart(items: Array): Awaitable; /** * Removes a specific item from the shopping cart. * @param item Item to be removed */ removeFromCart(item: CartItem): Awaitable; /** * Returns the available sizes for a garment with the given ID. * @param id Unique ID of the garment */ getSizes(id: string): Awaitable>; /** * Returns the available stock of a garment in a given size. You don't need to expose the exact stock. It is also * fine to return 1 if the item is in stock and 0 otherwise. * @param id Unique ID of the garment * @param sizeId Size identifier of the garment */ getStock(id: string, sizeId: string): Awaitable; /** * Returns if it is allowed to run add to cart operations in the MDRC. * If it is not set it will default to true! * @returns true if it is allowed to run add to cart operations in the MDRC */ allowAddToCart?(): Awaitable; } } /** * Namespace for look (outfit) related providers */ export declare namespace Looks { /** * Type for tokenized looks */ type LookToken = string; /** * Base look object */ interface Look { /** * Unique ID of the selected avatar */ avatar: string; /** * Unique ID of the selected scene */ scene: string; /** * Array of unique IDs of the dressed garments */ dressedGarments: Array; /** * Mode of the dressing room */ mode: Core.RenderMode; } /** * Extended object for looks that can be stored permanently */ interface SaveableLook extends Look { /** * Screenshot of the look encoded as base64 */ screenshot: string; } /** * Look object with otional avatar and scene. Used for sharing looks */ type LoadableLook = Partial & { mode: Core.RenderMode; dressedGarments: Array; }; /** * Provider for encoding and decoding looks into/from tokens. Option methods for storing and sharing */ interface LookProvider { /** * Serialize the provided look information as a token * @param look */ tokenizeLook(look: SaveableLook): Awaitable; /** * Resolve a token and extract the serialized look information * @param token */ resolveToken(token: LookToken): Awaitable; /** * Optional methods if the dressing room should support storing looks. Currently not being used */ storing?: { storeLook(token: LookToken): Awaitable; getAll(): Awaitable>; }; /** * Optional methods if the dressing room should support sharing */ sharing?: { /** * Triggered to inform the host adator that the MDR was opened */ onStartup(): void; /** * Creates a sharing URL for the provided look token. * @param token */ shareLook(token: LookToken): Awaitable; /** * Extracts a look token from the url of the website and returns it. */ resolve(): Awaitable; }; } } export declare namespace Logging { interface LoggingProvider { debug(...args: any[]): void; info(...args: any[]): void; warn(...args: any[]): void; err(...args: any[]): void; } } export declare namespace Analytics { export interface Metrics { RenderTryOn: { render_time: number; avatar: string; scene: string; garments: { id: string; title: string; }[]; }; Navigate: "TryOn" | "GarmentDetails" | "AvatarSelect" | "AvatarCreate" | "AvatarEdit" | "EditLook" | "ShareLook" | "SceneSelect" | "AvatarGenderSelect" | "AvatarHeightSelect" | "AvatarPantsSelect" | "AvatarChestSelect" | "AvatarReady" | "AvatarEditExpert" | "Onboarding"; } export type Pages = Metrics["Navigate"]; type CollectableMetric = { type: "Metric"; key: K; value: O[K]; }; type RenderEvent = CollectableMetric; type NavigateEvent = CollectableMetric; export type CollectableMetrics = RenderEvent | NavigateEvent; export type Collectable = { id: string; timestamp: number; attributes: Record; } & ({ type: "Log"; args: Array; } | CollectableMetrics); export type CollectFunction = (data: Collectable) => Awaitable; export type AnalyticsConfig = { enableTelemetry: true; collector: CollectFunction; } | { enableTelemetry: false; }; export {}; } export declare namespace PerformanceMetrics { interface PerformanceMetricsProvider { getCustomLabels(): Promise<{ [key: string]: string | number; }>; } } export declare namespace Translator { interface Translator { transform_key?(key: string): string | undefined; translate?(key: string): string | undefined; } } export type ByMode = { [mode in Core.RenderMode]?: T; }; export interface DressingRoomOptions { enablePhysicsSimulation?: boolean; } type AnalyticsContext = { id?: string; attributes?: Record; }; export type AnalyticsBuilder = { id: string; sendMetric: (metric: Omit) => AnalyticsBuilder; sendLog: (...args: any[]) => AnalyticsBuilder; timeAction: () => (callback: (duration: number) => void) => void; }; export interface IAnalytics { sendMetric: (context: AnalyticsContext, metric: Omit) => void; sendLog: (context: AnalyticsContext, ...args: any[]) => void; withContext: (context?: AnalyticsContext) => AnalyticsBuilder; } export type IHostAdaptor = Omit & { dressingRoom: { mode: Core.RenderMode; options: Required; }; logger: Logging.LoggingProvider; analytics: IAnalytics; }; /** * Interface for connecting the Modal Dressing Room Component (MDRC) with the host website. THe adaptor is responsible * for providing information about the content in the dressing room. This covers garments, avatars and scenes. Furthermore, * it provides (optional) functionality for further functionality like add to cart, looking sharing or custom avatars. */ export interface HostAdaptor { dressingRoom: { mode: Core.RenderMode; options?: DressingRoomOptions; }; /** * Mandatory provider to populate the dressing room with garments. */ garments: ByMode; /** * Mandatory provider to populate the dressing room with avatars. */ avatars: ByMode; /** * Mandatory provider to populate the dressing room with scenes. */ scenes: ByMode; animations?: Providers.AnimationProvider; commerce?: Commerce.CommerceProvider; inventory?: Inventory.InventoryProvider; customAvatars?: ByMode; recommendedGarments?: ByMode; looks?: Looks.LookProvider; logger?: Logging.LoggingProvider; analytics?: Analytics.AnalyticsConfig; performanceMetrics?: PerformanceMetrics.PerformanceMetricsProvider; translator?: Translator.Translator; callbacks?: { addProductsClicked?: () => void; }; }