UGC Widgets
    Preparing search index...

    Interface WidgetSDK

    The Widget SDK provides a set of helper methods for interacting with a UGC widget instance. This SDK allows you to query elements within the widget, access widget options and container, manage widget state, and load required libraries. It is designed to simplify widget integration and customization.

    interface WidgetSDK {
        getState: (key: string) => any;
        getTagGroup: () => undefined | string;
        getWidgetContainer: () => WidgetResponse;
        getWidgetOptions: () => WidgetOptions;
        getWidgetService: () => WidgetService;
        querySelector: <T extends Element = HTMLElement>(
            selector: string,
        ) => undefined | null | T;
        querySelectorAll: <T extends Element = HTMLElement>(
            selector: string,
        ) => undefined | NodeListOf<T>;
        renderLibs: () => Promise<void>;
        setState: (key: string, value: any) => void;
    }
    Index

    Properties

    getState: (key: string) => any

    Retrieve a value from the widget's global state.

    Type declaration

      • (key: string): any
      • Parameters

        • key: string

          The state key.

        Returns any

        The value stored for the given key.

    sdk.getState('key')
    
    getTagGroup: () => undefined | string

    Get the tag group from the widget.

    Type declaration

      • (): undefined | string
      • Returns undefined | string

        The tag group string or undefined.

    sdk.getTagGroup()
    
    getWidgetContainer: () => WidgetResponse

    Access the widget container object.

    Type declaration

      • (): WidgetResponse
      • Returns WidgetResponse

    sdk.getWidgetContainer()
    
    getWidgetOptions: () => WidgetOptions

    Access the widget options.

    Type declaration

      • (): WidgetOptions
      • Returns WidgetOptions

    sdk.getWidgetOptions()
    
    getWidgetService: () => WidgetService

    Access the widget service instance.

    Type declaration

      • (): WidgetService
      • Returns WidgetService

    sdk.getWidgetService()
    
    querySelector: <T extends Element = HTMLElement>(
        selector: string,
    ) => undefined | null | T

    Retrieve a single element inside the widget placement.

    Type declaration

      • <T extends Element = HTMLElement>(selector: string): undefined | null | T
      • Type Parameters

        • T extends Element = HTMLElement

        Parameters

        • selector: string

          CSS selector string.

        Returns undefined | null | T

        The first matching element or null/undefined.

    sdk.querySelector('.ugc-tile')
    
    querySelectorAll: <T extends Element = HTMLElement>(
        selector: string,
    ) => undefined | NodeListOf<T>

    Retrieve all elements inside the widget placement matching the selector.

    Type declaration

      • <T extends Element = HTMLElement>(selector: string): undefined | NodeListOf<T>
      • Type Parameters

        • T extends Element = HTMLElement

        Parameters

        • selector: string

          CSS selector string.

        Returns undefined | NodeListOf<T>

        A NodeList of matching elements or undefined.

    sdk.querySelectorAll('.ugc-tile')
    
    renderLibs: () => Promise<void>

    Load the libraries if required.

    Type declaration

      • (): Promise<void>
      • Returns Promise<void>

    await sdk.renderLibs();
    

    if the widget service is not available or if the libraries cannot be loaded.

    setState: (key: string, value: any) => void

    Store a value in the widget's global state.

    Type declaration

      • (key: string, value: any): void
      • Parameters

        • key: string

          The state key.

        • value: any

          The value to store.

        Returns void

    sdk.setState('key', 'value')