Unlink Component (Beta)

element.unlinkComponent()

Converts a component instance into a plain element tree, detaching it from its component definition.

After unlinking, the returned element is no longer a ComponentInstance — it is a regular element with the same visual structure. Changes to the original component definition will no longer affect it.

This action is undoable via the Designer’s undo stack.

Syntax

element.unlinkComponent(): Promise<AnyElement>

Returns

Promise<AnyElement>

A Promise that resolves to the root element of the detached element tree.

Example

const elements = await webflow.getAllElements();
const componentInstance = elements.find(el => el.type === 'ComponentInstance');
if (componentInstance?.type === 'ComponentInstance') {
  const unlinkedRoot = await componentInstance.unlinkComponent();
  console.log('Unlinked element type:', unlinkedRoot.type);
  // The element is now a regular element, no longer a ComponentInstance
}

Designer Ability