Get all variants of a component (Beta)

component.getVariants()

Retrieves all variants of a component.

Beta

This feature is released as part of a Beta program and may change in future releases.

Syntax

1component.getVariants(): Promise<Variant[]>

Returns

Promise<Array<Variant>>

A promise that returns an array of variants.

Example

1const component = (await webflow.getAllComponents())[0];
2const variants = await component.getVariants();
3console.log(variants);
4// [
5// { id: 'base', name: 'Primary', isSelected: true },
6// { id: 'xxxx', name: 'Secondary', isSelected: false },
7// ]
8// Find which variant the user is currently editing
9const activeVariant = variants.find(v => v.isSelected);
10console.log(`Currently editing: ${activeVariant?.name}`);

Designer Ability

Checks for authorization only

Designer AbilityPermissionLocaleBranchWorkflowSitemode
canAccessCanvasanyanyanyanyany