> For the complete documentation index, see [llms.txt](https://docs.umbraco.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.umbraco.com/umbraco-cms/extend-your-project/backoffice-extensions/property-editors/composition/property-editor-data-source.md).

# Property Editor Data Source

A Property Editor Data Source is a way to provide data to a Property Editor UI. This allows for the reuse of the same UI across different data sources.

Data Sources are an opt-in feature for the Property Editor UI. When enabled, extensions can register Data Sources, which can be selected in the UI if their type is supported.

## Enable Data Source Support

The Data Source support is enabled in the Property Editor UI manifest. Below is a snippet showing how to enable it. The `forDataSourceTypes` can include any already existing Data Source Types or new custom ones.

**Property Editor UI Manifest**

```typescript
{
  type: 'propertyEditorUi',
  name: 'My Property Editor UI with Data Source support',
  //... more
  meta: {
    //... more
    supportsDataSource: {
      enabled: true,
      forDataSourceTypes: ['My.DataSourceType.Custom']
    }
  }
}
```

When this feature is enabled, you can pick a Data Source in the Data Type Workspace next to the Property Editor field. The available Data Sources will match the supported Data Source Types of the chosen Property Editor UI.

<figure><img src="/files/iMaNiF6hOBVI4qnZN5u0" alt=""><figcaption><p>Property Editor Data Source Picker</p></figcaption></figure>

## Register a Property Editor Data Source

**Data Source Manifest**

```typescript
 {
  type: 'propertyEditorDataSource',
  dataSourceType: 'My.DataSourceType.Custom',
  alias: 'Umb.PropertyEditorDataSource.MyCustomDataSource',
  name: 'My Custom Data Source',
  api: () => import('./my-custom-data-source.js'),
  meta: {
   label: 'My Data',
   description: 'A good description of the data',
   icon: 'icon-database',
  },
 },
```

### Data Source Settings

Like Property Editor UIs and Schemas, Data Sources can have settings for configuration of the data source. These settings are defined in the manifest under `meta.settings`. The settings for a Data Source will be rendered in the Data Type Workspace together with the Property Editor UI and Schema settings.

**Data Source Manifest**

```typescript
{
  type: 'propertyEditorDataSource',
  alias: 'Umb.PropertyEditorDataSource.MyCustomDataSource',
  //... more
  meta: {
    //... more
    settings: {
      properties: [],
    },
  },
};
```

## Access Data Source Alias in Property Editor UI

When implementing a Property Editor UI element, the Data Source alias can be accessed through the `dataSourceAlias` property.

```typescript
interface UmbPropertyEditorUiElement extends HTMLElement {
    dataSourceAlias?: string;
}
```

## Access Data Source Config in Property Editor UI

The Data Source configuration can be accessed through the `config` property of the Property Editor UI element merged with the UI and Schema config.

## Built-in Data Source Types

* [Picker](/umbraco-cms/extend-your-project/backoffice-extensions/property-editors/property-editor-data-source-types/picker.md) - Used by Property Editors that pick entities, for example, the Entity Data Picker Property Editor.


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://docs.umbraco.com/umbraco-cms/extend-your-project/backoffice-extensions/property-editors/composition/property-editor-data-source.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.