Web-component API

• Last updated on March 3, 2025
• •
• Less than a minute to read

This API allows you to interact with a web component through calls to its methods or to receive and modify data using its properties.

The API of the web component will only be available after it has been loaded and initialized, and you will need to get the HTML element using a method available in the Document Object Model (DOM). For example, you can use getElementByTagName(tag):

const editor = document.getElementByTagName("au-template-editor").item(0);

After obtaining the element, you can call this API methods.

Methods

init(configuration)

Description: Initializes the component after reading parameters from the workflow and opening a product.

Arguments:

• configuration: IConfiguratorInitArgs

Returns: void

Example:

editor.init(
    configVersion: 2,
    integration: {
        tenantId: <yourTenantId>,
        user: {
            id: <userId>,
            token: <userToken>
        },
        storefrontId: <yourStorefrontId>,
        cchubApiGatewayUrl: "https://api.customerscanvashub.com/"
    },
    input: {
        designTemplateId: <templateId>
    },
    settings: {
        itemBuilder: {
            image: { borderWidth: 10, borderColor: "rgb(255, 0, 13)" }
        },
        listSettings: { bulletChar: "*" }
  }
);