> 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: Introduction

## Article: Introduction

## Article Link: https://dev.wix.com/docs/sdk/host-modules/editor/introduction.md

## Article Content:

# Editor API

> **Note:** This API is not intended for use in [site development](https://dev.wix.com/docs/sdk/articles/get-started/about-site-development.md).

The Editor API enables code running within a Wix editor (for example in a [settings panel](https://dev.wix.com/docs/build-apps/develop-your-app/extensions/site-extensions/site-widgets/create-a-settings-panel-for-a-site-widget-or-plugin-wix-cli-and-self-hosting.md)) to interact with other parts of the editor. Using the API, you can access the properties of a widget on the editor canvas, retrieve data about the editor environment, and more.

## Setup

@package_metadata:@wix/editor

To use the Editor API, install the `@wix/editor` package. 

### Install the package

Follow the installation instructions for your development environment. 

| Development environment    | Installation method |
| -------------------------- | ------------------- |
| Blocks apps                | Use the [package manager](https://dev.wix.com/docs/develop-websites/articles/coding-with-velo/packages/work-with-npm-packages-in-the-editor.md). |
| CLI and self-hosted apps   | Run `npm install @wix/editor` or `yarn add @wix/editor`. |

### Usage

To use the package, follow the import and usage instructions below based on your development environment.

#### Wix-hosted apps

To use the Editor API in [Wix-hosted apps](https://dev.wix.com/docs/sdk/articles/get-started/about-the-wix-java-script-sdk.md#wix-hosted-apps), import one of the editor submodules in your code and call it's methods directly. For example:

```js
import { widget } from "@wix/editor";

async function getWidgetProp(propName) {
  const response = await widget.getProp(propName);
}
```

#### Self-hosted apps

To use the Editor API in [self-hosted apps](https://dev.wix.com/docs/sdk/articles/get-started/about-self-hosted-apps.md), first create a [Wix Client](https://dev.wix.com/docs/sdk/core-modules/sdk/wix-client.md) using one of the editor submodules. For example:

```js
import { editor } from '@wix/editor';
import { createClient } from '@wix/sdk';

const client = createClient({
  host: editor.host(),
  auth: editor.auth(),
  modules: {
    widget,
  },
});
```

Then, use the client to call the submodule's methods. For example:

```js
async function getWidgetProp(propName) {
  const response = await client.widget.getProp(propName);
}
```