<aside>
💡 Context: The infobox is a property is within the layer object.
</aside>
Description: It is a flexible structure designed to define the configuration and content of an infobox associated with a layer. An infobox serves as a UI element that displays additional information or interactive content related to the layer. It can be customized extensively through its properties and blocks to suit specific needs or presentation styles.
Structure:
Infobox<BP = any> = { // This generic type allows for customization and flexibility in defining the content and behavior of the infobox. The infobox structure includes:
property: InfoboxProperty // (Optional)Defines the default appearance and behavior settings of the infobox. These settings can include visual and functional properties such as size, position, padding, background color, typography, and more.
blocks: Block<BP>[] //An array of Block objects, each potentially representing a different piece of content or functionality within the infobox. Each block can be a distinct component, like a text block, image, or interactive element, and is defined by its own properties.
}
Description: Defines the default appearance and behavior settings of the infobox. These settings can include visual and functional properties such as size, position, padding, background color, typography, and more.
<aside> 💡 The InfoboxProperty is explained in details here
</aside>
Structure:
default //(Optional): Contains default configuration settings for the infobox, such as:
showTitle: boolean //(Optional) - Whether to display the title of the infobox.
title: string //(Optional) - The title text of the infobox.
height: number //(Optional) - The height of the infobox.
heightType: "auto" | "manual" //(Optional) - Specifies whether the height is automatic or manually set.
infoboxPaddingTop, infoboxPaddingBottom, infoboxPaddingLeft, infoboxPaddingRight: number //(Optional) - Padding settings for the infobox.
size: "small" | "medium" | "large" //(Optional) - The size of the infobox.
position: "right" | "middle" | "left" //(Optional) - The position of the infobox relative to the layer.
typography: Typography //(Optional) - Typographic settings for text within the infobox.
bgcolor: string //(Optional) - The background color of the infobox.
outlineColor: string //(Optional) - Color of the outline around the infobox.
outlineWidth: number //(Optional) - Width of the outline around the infobox.
useMask: boolean //(Optional) - Whether a mask is applied to the infobox background.
Description: An array of Block objects, each potentially representing a different piece of content or functionality within the infobox. Each block can be a distinct component, like a text block, image, or interactive element, and is defined by its own properties.
<aside> 💡 The Block property is explained in details here
</aside>
Structure:
id: string //Unique identifier for each block.
pluginId: string //(Optional) - Identifier of the plugin providing the block.
extensionId: string //(Optional) - Identifier of the extension within the plugin that provides the block.
property: P //(Optional) - Custom properties specific to the block.
propertyId: string //(Optional) - Identifier linking the block to external properties.