Initialize the window's Layout. Must be called from a custom window that has a 'layout' option set upon creation of that window. If a containerId is not provided, this method attempts to find an element with the id layout-container.

A Layout will emit events locally on the DOM element representing the layout-container. In order to capture the relevant events during Layout initiation, set up the listeners on the DOM element prior to calling init.

Example

// if no options are included, the layout in the window options is initialized in an element with the id `layout-container`
const layout = await fin.Platform.Layout.init();

Example

To target a different HTML element use the options object.

const containerId = 'my-custom-container-id';

const myLayoutContainer = document.getElementById(containerId);

myLayoutContainer.addEventListener('tab-created', function(event) {
    const { tabSelector } = event.detail;
    const tabElement = document.getElementById(tabSelector);
    const existingColor = tabElement.style.backgroundColor;
    tabElement.style.backgroundColor = "red";
    setTimeout(() => {
        tabElement.style.backgroundColor = existingColor;
    }, 2000);
});

// initialize the layout into an existing HTML element with the div `my-custom-container-id`
// the window must have been created with a layout in its window options 
const layout = await fin.Platform.Layout.init({ containerId });