> Portal Navigation:
> 
> - Append `.md` to any URL under `https://dev.wix.com/docs/` to get its markdown version.
> - Pages are either content pages (article or reference text) or menu pages (a list of links to child pages).
> - To get a menu page, truncate any URL to a parent path and append `.md` (e.g. `https://dev.wix.com/docs/sdk.md`, `https://dev.wix.com/docs/sdk/core-modules.md`).
> - Top-level index of all portals: https://dev.wix.com/docs/llms.txt
> - Full concatenated docs: https://dev.wix.com/docs/llms-full.txt

## Resource: Root Properties

## Article: Root Properties

## Article Link: https://dev.wix.com/docs/build-apps/develop-your-app/extensions/site-extensions/editor-react-components/manifest-reference/root-properties/root-properties.md

## Article Content:

import { Property, PropertyList } from "@wix/docs-ui/content";


# Root Properties
<blockquote className="caution">

__Alpha:__
Editor React Components are currently in alpha. This feature is subject to change and may have bugs, issues, and limitations. We're actively improving it based on your feedback.

</blockquote>


Each property in your manifest configures an aspect of how the editor loads, presents, and manages your [Editor React Component](https://dev.wix.com/docs/build-apps/develop-your-app/extensions/site-extensions/editor-react-components/about-editor-react-components.md).

## Manifest properties

<PropertyList bordered>
  <Property
    name="type"
    type="string"
    required
    description={<>A unique identifier for the component in the format 'codeIdentifier.componentName'. Find your app&apos;s <a href="fallback::https://dev.wix.com/docs/build-apps/develop-your-app/app-workspace/app-dashboard/code-identifier">code.md identifier</a> in the app dashboard, and choose any name for 'componentName'. The editor uses this value to identify which component to render when a Wix user adds it to their site.</>}
  />
  <Property
    name="description"
    type="string"
    description="A short description of the component's purpose."
  />
  <Property
    name="resources"
    type={<><a href="portalId::63e3acd8-2a9c-421d-8f92-d02930eeb59eresourceId::f9653c44-b4c0-49f1-9896-93ad14680d59*fallback::https://dev.wix.com/docs/build-apps/develop-your-app/extensions/site-extensions/editor-react-components/manifest-reference/resources">Resources</a></>}.md
    required
    description="Declares the code and assets for your component: client and editor bundles, CSS, server rendering, SDK, translations, and animation configuration."
  />
  <Property
    name="installation"
    type={<><a href="portalId::63e3acd8-2a9c-421d-8f92-d02930eeb59eresourceId::f6409db5-7fba-46fa-a65a-dd7522a5fb9d*fallback::https://dev.wix.com/docs/build-apps/develop-your-app/extensions/site-extensions/editor-react-components/manifest-reference/installation">Installation</a></>}.md
    description="Controls initial sizing, preset selection per breakpoint, and placement when a Wix user first adds the component."
  />
  <Property
    name="editorElement"
    type={<><a href="portalId::63e3acd8-2a9c-421d-8f92-d02930eeb59eresourceId::de441dea-da03-4e15-add1-96b645296482*fallback::https://dev.wix.com/docs/build-apps/develop-your-app/extensions/site-extensions/editor-react-components/manifest-reference/editor-element/editor-element">EditorElement</a></>}.md
    required
    description="The core of the manifest. Defines the component's root selector, display name, and all configurable properties including data, styling, layout, presets, states, and more."
  />
</PropertyList>

## Examples

### Minimal manifest

A manifest with only the required properties. The component renders in the editor but doesn't expose any customization controls.

```typescript
{
  type: 'myApp.myWidget',
  resources: {
    client: {
      componentUrl: './extensions/site/components/my-widget/component.tsx',
    },
  },
  editorElement: {
    selector: '.my-widget',
    displayName: 'My Widget',
  },
}
```

### Manifest with data and design controls

A manifest that exposes editable text and image content, plus design controls for background color and padding.

```typescript
{
  type: 'myApp.profileCard',
  resources: {
    client: {
      componentUrl: './extensions/site/components/profile-card/component.tsx',
    },
  },
  editorElement: {
    selector: '.profile-card',
    displayName: 'Profile Card',
    data: {
      name: {
        dataType: 'text',
        displayName: 'Name',
        defaultValue: 'Jane Doe',
      },
      photo: {
        dataType: 'image',
        displayName: 'Photo',
      },
    },
    cssProperties: {
      backgroundColor: { defaultValue: '#ffffff' },
      padding: { defaultValue: '24px' },
    },
  },
}
```

## See also

- [About the Manifest](https://dev.wix.com/docs/build-apps/develop-your-app/extensions/site-extensions/editor-react-components/manifest-reference/about-the-manifest.md)
- [About Editor React Components](https://dev.wix.com/docs/build-apps/develop-your-app/extensions/site-extensions/editor-react-components/about-editor-react-components.md)