> 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/site-extensions/editor-react-components/manifest-reference/root-properties/root-properties.md

## Article Content:

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


# Root Properties
Each property in your manifest configures an aspect of how the editor loads, presents, and manages your [Editor React Component (ERC)](https://dev.wix.com/docs/overview/extensions-framework/site-extensions/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`. In a Studio Two site, the code identifier is always `companionApp`. In a Wix CLI app, use the app's code identifier from the app dashboard. Choose `componentName` yourself, using only valid JavaScript identifier characters, and keep it unique among your components. The editor uses this value to identify which component to render when a Wix user adds it to a site."
  />
  <Property
    name="description"
    type="string"
    description="A short description of the component's purpose."
  />
  <Property
    name="resources"
    type={<><a href="fallback::https://dev.wix.com/docs/site-extensions/editor-react-components/manifest-reference/root-properties/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="fallback::https://dev.wix.com/docs/site-extensions/editor-react-components/manifest-reference/root-properties/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="fallback::https://dev.wix.com/docs/site-extensions/editor-react-components/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

The examples use the Studio Two code identifier, `companionApp`.

### Minimal manifest

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

```typescript
{
  type: 'companionApp.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: 'companionApp.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 Editor React Component Manifest](https://dev.wix.com/docs/site-extensions/editor-react-components/manifest-reference/about-the-editor-react-component-manifest.md)
- [About Editor React Components](https://dev.wix.com/docs/overview/extensions-framework/site-extensions/editor-react-components.md)