Get selected variant (Beta)

component.getSelectedVariant()

Retrieves the selected variant of a component.

If no variant is selected (that is, with the isSelected attribute set to true), the function returns the base variant of the specified component. Similarly, if the currently selected component in the Designer is not a variant of the specified component, no variant of the specified component is selected, so the function returns the base variant of the specified component.

Beta

These methods are in public beta and may change with future releases.

Syntax

component.getSelectedVariant(): Promise<Variant>

Returns

Promise<Variant>

A promise that returns a variant.

Example

const selectedVariant = await heroComponent.getSelectedVariant();
/*
{
id: 'variant-123',
name: 'Secondary Hero',
isSelected: true,
}
*/
// When no variant is explicitly selected, returns base
const base = await heroComponent.getSelectedVariant();
/*
{
id: 'base',
name: 'Primary',
isSelected: true,
}
*/

Designer Ability

Checks for authorization only

Designer AbilityPermissionLocaleBranchWorkflowSitemode
canAccessCanvasanyanyanyanyany