> This page is for Home.

> For clean Markdown of any page, append .md to the page URL.
> For a complete documentation index, see https://developers.webflow.com/llms.txt.
> For AI client integration (Claude Code, Cursor, etc.), connect to the MCP server at https://developers.webflow.com/_mcp/server.

# New component methods

> New methods for working with components in the Designer API

These new functions are now available in the Designer API:

* [`webflow.getCurrentComponent()`](/designer/reference/get-current-component): Get the component that is currently being edited (Beta)
* [`element.getParentComponent()`](/designer/reference/get-parent-component): Get the component that contains a given element (Beta)
* [`component.getSettings()`](/designer/reference/get-component-settings): Get the name, group, and description of a component (Beta)
* [`component.setSettings()`](/designer/reference/set-component-settings): Update one or more settings on a component (Beta)

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

## Getting the selected component

You can now retrieve the component that is currently being edited with the new `webflow.getCurrentComponent()` function (Beta).
If no component is being edited, the method returns `null`.

```typescript
const component = await webflow.getCurrentComponent();
if (component) {
  const name = await component.getName();
  console.log(`Currently editing component: ${name}`);
  // Example: get all elements inside the active component
  const root = await component.getRootElement();
  const children = await root.getChildren();
  console.log(`Root has ${children.length} child element(s)`);
} else {
  console.log('Not currently editing a component.');
}
```

For more information, see [Get the selected component](/designer/reference/get-current-component).

## Getting an element's parent component

You can now retrieve the component that directly contains a given element with the new `element.getParentComponent()` function (Beta).
If the element is not inside a component, the method returns `null`.

```typescript
const element = await webflow.getSelectedElement();
if (element) {
  const parentComponent = await element.getParentComponent();
  if (parentComponent) {
    const name = await parentComponent.getName();
    console.log(`Element is inside component: ${name}`);
  } else {
    console.log('Element is not inside a component.');
  }
}
```

For more information, see [Get the parent component](/designer/reference/get-parent-component).

## Getting and setting component settings

The new `component.getSettings()` and `component.setSettings()` functions let you read and update a component's name, group, and description in a single call:

```typescript
const components = await webflow.getAllComponents();
const component = components[0];

// Read all settings at once
const settings = await component.getSettings();
console.log(settings.name);        // 'Hero Section'
console.log(settings.group);       // 'Sections'
console.log(settings.description); // 'A reusable hero with heading and CTA'

// Update only the description
await component.setSettings({
  description: 'Updated hero layout with video background',
});

// Update all settings at once
await component.setSettings({
  name: 'Hero Section v2',
  group: 'Sections',
  description: 'Redesigned hero component',
});
```

For more information, see:

* [Get component settings](/designer/reference/get-component-settings)
* [Set component settings](/designer/reference/set-component-settings)