Get Selected Slot (Beta)

`element.getSelectedSlot()`

Returns the slot that is currently selected in the Designer on a component instance, or null if no slot is selected.

Use this to read the active slot context before appending or inspecting its children.

Beta

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

Syntax

1 element.getSelectedSlot(): Promise<SlotInstanceElement | null>

Returns

Promise<SlotInstanceElement | null>

A Promise that resolves to the selected SlotInstanceElement, or null if no slot is currently selected.

Example

1 const elements = await webflow.getAllElements();
2 const componentInstance = elements.find(el => el.type === 'ComponentInstance');
3 
4 if (componentInstance?.type === 'ComponentInstance') {
5   const selectedSlot = await componentInstance.getSelectedSlot();
6 
7   if (selectedSlot) {
8     const name = await selectedSlot.getDisplayName();
9     console.log(`Selected slot: ${name}`);
10   } else {
11     console.log('No slot is currently selected');
12   }
13 }

Designer Ability

Designer Ability	Locale	Branch	Workflow	Sitemode
canAccessCanvas	Any	Any	Any	Any

1	const elements = await webflow.getAllElements();
2	const componentInstance = elements.find(el => el.type === 'ComponentInstance');
3
4	if (componentInstance?.type === 'ComponentInstance') {
5	const selectedSlot = await componentInstance.getSelectedSlot();
6
7	if (selectedSlot) {
8	const name = await selectedSlot.getDisplayName();
9	console.log(`Selected slot: ${name}`);
10	} else {
11	console.log('No slot is currently selected');
12	}
13	}