From 1e50fd935512172d97d923b62e25bd064d850ca0 Mon Sep 17 00:00:00 2001
From: Sergio Alvarenga <71974638+salvar3nga@users.noreply.github.com>
Date: Tue, 18 Feb 2025 17:16:22 +0100
Subject: [PATCH 1/2] chore: update release please version to 0.37.2 (#1627)

* chore: release 0.37.2

Release-As: 0.37.2

---------

Co-authored-by: Sergio Alvarenga <s.alvarenga@sprinteins.com>

From 00c4dc06f6d0cf1c39e4822a5b21d650d698785e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tam=C3=A1s=20Russ?= <github@tamasruss.com>
Date: Wed, 19 Feb 2025 10:07:49 +0100
Subject: [PATCH 2/2] Fix: inconsistent plugin activation behaviour caused by
 refactoring (#1626)

---
 package-lock.json                             |  115 -
 packages/core/foundation/plugin.ts            |   24 +-
 packages/openscd/package.json                 |    1 +
 packages/openscd/src/addons/Layout.ts         |  352 +--
 .../plugin-manager/custom-plugin-dialog.ts    |  207 ++
 .../addons/plugin-manager/plugin-manager.ts   |  186 ++
 packages/openscd/src/open-scd.ts              |  105 +-
 packages/openscd/src/plugin.ts                |   24 +-
 packages/openscd/src/plugins.ts               |   73 +-
 .../__snapshots__/open-scd.test.snap.js       | 2684 +++++------------
 packages/openscd/test/unit/Plugging.test.ts   |  617 ++--
 .../editors/__snapshots__/IED.test.snap.js    |    1 -
 12 files changed, 1664 insertions(+), 2725 deletions(-)
 create mode 100644 packages/openscd/src/addons/plugin-manager/custom-plugin-dialog.ts
 create mode 100644 packages/openscd/src/addons/plugin-manager/plugin-manager.ts

diff --git a/package-lock.json b/package-lock.json
index af9e7b65be..abba14296e 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -2604,12 +2604,6 @@
         "node": ">=6.9.0"
       }
     },
-    "node_modules/@import-maps/resolve": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/@import-maps/resolve/-/resolve-1.0.1.tgz",
-      "integrity": "sha512-tWZNBIS1CoekcwlMuyG2mr0a1Wo5lb5lEHwwWvZo+5GLgr3e9LLDTtmgtCWEwBpXMkxn9D+2W9j2FY6eZQq0tA==",
-      "dev": true
-    },
     "node_modules/@isaacs/cliui": {
       "version": "8.0.2",
       "resolved": "https://registry.npmjs.org/@isaacs/cliui/-/cliui-8.0.2.tgz",
@@ -8731,114 +8725,6 @@
       "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
       "dev": true
     },
-    "node_modules/@web/dev-server-import-maps": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/@web/dev-server-import-maps/-/dev-server-import-maps-0.2.1.tgz",
-      "integrity": "sha512-iGM7s4qenmTDUWC2iV0HoQ1NR5lAyRxVHOpWzTsFH/TnUZzP+YuL6QIFtB2v2v7URfhGL2l2WPIibmliToITcg==",
-      "dev": true,
-      "dependencies": {
-        "@import-maps/resolve": "^1.0.1",
-        "@types/parse5": "^6.0.1",
-        "@web/dev-server-core": "^0.7.2",
-        "@web/parse5-utils": "^2.1.0",
-        "parse5": "^6.0.1",
-        "picomatch": "^2.2.2"
-      },
-      "engines": {
-        "node": ">=18.0.0"
-      }
-    },
-    "node_modules/@web/dev-server-import-maps/node_modules/@web/dev-server-core": {
-      "version": "0.7.5",
-      "resolved": "https://registry.npmjs.org/@web/dev-server-core/-/dev-server-core-0.7.5.tgz",
-      "integrity": "sha512-Da65zsiN6iZPMRuj4Oa6YPwvsmZmo5gtPWhW2lx3GTUf5CAEapjVpZVlUXnKPL7M7zRuk72jSsIl8lo+XpTCtw==",
-      "dev": true,
-      "dependencies": {
-        "@types/koa": "^2.11.6",
-        "@types/ws": "^7.4.0",
-        "@web/parse5-utils": "^2.1.0",
-        "chokidar": "^4.0.1",
-        "clone": "^2.1.2",
-        "es-module-lexer": "^1.0.0",
-        "get-stream": "^6.0.0",
-        "is-stream": "^2.0.0",
-        "isbinaryfile": "^5.0.0",
-        "koa": "^2.13.0",
-        "koa-etag": "^4.0.0",
-        "koa-send": "^5.0.1",
-        "koa-static": "^5.0.0",
-        "lru-cache": "^8.0.4",
-        "mime-types": "^2.1.27",
-        "parse5": "^6.0.1",
-        "picomatch": "^2.2.2",
-        "ws": "^7.5.10"
-      },
-      "engines": {
-        "node": ">=18.0.0"
-      }
-    },
-    "node_modules/@web/dev-server-import-maps/node_modules/@web/parse5-utils": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/@web/parse5-utils/-/parse5-utils-2.1.0.tgz",
-      "integrity": "sha512-GzfK5disEJ6wEjoPwx8AVNwUe9gYIiwc+x//QYxYDAFKUp4Xb1OJAGLc2l2gVrSQmtPGLKrTRcW90Hv4pEq1qA==",
-      "dev": true,
-      "dependencies": {
-        "@types/parse5": "^6.0.1",
-        "parse5": "^6.0.1"
-      },
-      "engines": {
-        "node": ">=18.0.0"
-      }
-    },
-    "node_modules/@web/dev-server-import-maps/node_modules/chokidar": {
-      "version": "4.0.3",
-      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-4.0.3.tgz",
-      "integrity": "sha512-Qgzu8kfBvo+cA4962jnP1KkS6Dop5NS6g7R5LFYJr4b8Ub94PPQXUksCw9PvXoeXPRRddRNC5C1JQUR2SMGtnA==",
-      "dev": true,
-      "dependencies": {
-        "readdirp": "^4.0.1"
-      },
-      "engines": {
-        "node": ">= 14.16.0"
-      },
-      "funding": {
-        "url": "https://paulmillr.com/funding/"
-      }
-    },
-    "node_modules/@web/dev-server-import-maps/node_modules/es-module-lexer": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/es-module-lexer/-/es-module-lexer-1.6.0.tgz",
-      "integrity": "sha512-qqnD1yMU6tk/jnaMosogGySTZP8YtUgAffA9nMN+E/rjxcfRQ6IEk7IiozUjgxKoFHBGjTLnrHB/YC45r/59EQ==",
-      "dev": true
-    },
-    "node_modules/@web/dev-server-import-maps/node_modules/lru-cache": {
-      "version": "8.0.5",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-8.0.5.tgz",
-      "integrity": "sha512-MhWWlVnuab1RG5/zMRRcVGXZLCXrZTgfwMikgzCegsPnG62yDQo5JnqKkrK4jO5iKqDAZGItAqN5CtKBCBWRUA==",
-      "dev": true,
-      "engines": {
-        "node": ">=16.14"
-      }
-    },
-    "node_modules/@web/dev-server-import-maps/node_modules/parse5": {
-      "version": "6.0.1",
-      "resolved": "https://registry.npmjs.org/parse5/-/parse5-6.0.1.tgz",
-      "integrity": "sha512-Ofn/CTFzRGTTxwpNEs9PP93gXShHcTq255nzRYSKe8AkVpZY7e1fpmTfOyoIvjP5HG7Z2ZM7VS9PPhQGW2pOpw==",
-      "dev": true
-    },
-    "node_modules/@web/dev-server-import-maps/node_modules/readdirp": {
-      "version": "4.1.1",
-      "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-4.1.1.tgz",
-      "integrity": "sha512-h80JrZu/MHUZCyHu5ciuoI0+WxsCxzxJTILn6Fs8rxSnFPh+UVHYfeIxK1nVGugMqkfC4vJcBOYbkfkwYK0+gw==",
-      "dev": true,
-      "engines": {
-        "node": ">= 14.18.0"
-      },
-      "funding": {
-        "type": "individual",
-        "url": "https://paulmillr.com/funding/"
-      }
-    },
     "node_modules/@web/dev-server-rollup": {
       "version": "0.4.1",
       "resolved": "https://registry.npmjs.org/@web/dev-server-rollup/-/dev-server-rollup-0.4.1.tgz",
@@ -31694,7 +31580,6 @@
         "@typescript-eslint/eslint-plugin": "^4.29.2",
         "@typescript-eslint/parser": "^4.29.2",
         "@web/dev-server-esbuild": "^0.2.16",
-        "@web/dev-server-import-maps": "^0.2.1",
         "@web/test-runner": "^0.13.22",
         "@web/test-runner-playwright": "^0.11.0",
         "concurrently": "^6.2.1",
diff --git a/packages/core/foundation/plugin.ts b/packages/core/foundation/plugin.ts
index 300bb19adc..712c666912 100644
--- a/packages/core/foundation/plugin.ts
+++ b/packages/core/foundation/plugin.ts
@@ -1,12 +1,28 @@
 import { targetLocales } from '../locales.js';
 
 export type Plugin = {
+  // name defines the name of the plugin
   name: string;
-  translations?: Record<(typeof targetLocales)[number], string>;
+  // src defines the path to the plugins source file
   src: string;
-  icon: string;
-  requireDoc?: boolean;
+  // kind defines the type of the plugin
+  kind: PluginKind;
+  // activeByDefault configures if the plugin should be active by default
+  // this is will be user when users resets the plugins
+  activeByDefault: boolean;
+  // icon stores the icon name of the Material Icon
+  icon?: string;
+  // active shows if the plugin currently is active
   active?: boolean;
-  position: ('top' | 'middle' | 'bottom') | number;
+  // requireDoc shows if the plugin requires a document to be loaded
+  requireDoc?: boolean;
+  // position defines the position of menu plugins
+  position?: MenuPosition
+  translations?: Record<(typeof targetLocales)[number], string>;
 };
+
 export type PluginSet = { menu: Plugin[]; editor: Plugin[] };
+export type PluginKind = 'editor' | 'menu' | 'validator';
+export const menuPosition = ['top', 'middle', 'bottom'] as const;
+export type MenuPosition = (typeof menuPosition)[number];
+
diff --git a/packages/openscd/package.json b/packages/openscd/package.json
index 2c57aedc35..4b64689d4a 100644
--- a/packages/openscd/package.json
+++ b/packages/openscd/package.json
@@ -60,6 +60,7 @@
     "test:manual": "web-test-runner --manual",
     "test:watch": "web-test-runner --watch",
     "test:unit": "web-test-runner --watch --group unit",
+    "test:unit:headless": "web-test-runner --watch --group unit --concurrency 1 --headless",
     "test:integration": "web-test-runner --watch --group integration",
     "doc:clean": "npx rimraf doc",
     "doc:typedoc": "typedoc --plugin none --out doc --entryPointStrategy expand ./src",
diff --git a/packages/openscd/src/addons/Layout.ts b/packages/openscd/src/addons/Layout.ts
index 68055f25f7..78c0cce4b3 100644
--- a/packages/openscd/src/addons/Layout.ts
+++ b/packages/openscd/src/addons/Layout.ts
@@ -54,10 +54,41 @@ import '@material/mwc-select';
 import '@material/mwc-textfield';
 import { nothing } from 'lit';
 
+import {OscdPluginManager} from "./plugin-manager/plugin-manager.js";
+import "./plugin-manager/plugin-manager.js";
+import {OscdCustomPluginDialog} from "./plugin-manager/custom-plugin-dialog.js";
+import "./plugin-manager/custom-plugin-dialog.js";
+
 
 @customElement('oscd-layout')
 export class OscdLayout extends LitElement {
 
+  /** The `XMLDocument` to be edited */
+  @property({ attribute: false }) doc: XMLDocument | null = null;
+  /** The name of the current [[`doc`]] */
+  @property({ type: String }) docName = '';
+  /** Index of the last [[`EditorAction`]] applied. */
+  @property({ type: Number }) editCount = -1;
+  /** The currently active editor tab. */
+  @property({ type: Number }) activeTab = 0;
+
+  /** The plugins to render the layout. */
+  @property({ type: Array }) plugins: Plugin[] = [];
+
+  /** The open-scd host element */
+  @property({ type: Object }) host!: HTMLElement;
+
+  @property({ type: Object }) historyState!: HistoryState;
+
+  @state() validated: Promise<void> = Promise.resolve();
+  @state() shouldValidate = false;
+
+  @query('#menu') menuUI!: Drawer;
+  @query('#pluginManager') pluginUI!: OscdPluginManager;
+  @query('#pluginList') pluginList!: List;
+  @query('#pluginAdd') pluginDownloadUI!: OscdCustomPluginDialog;
+
+
   render(): TemplateResult {
     return html`
       <div
@@ -73,55 +104,36 @@ export class OscdLayout extends LitElement {
   }
 
 
-  /** The `XMLDocument` to be edited */
-  @property({ attribute: false })
-  doc: XMLDocument | null = null;
-  /** The name of the current [[`doc`]] */
-  @property({ type: String })
-  docName = '';
-  /** Index of the last [[`EditorAction`]] applied. */
-  @property({ type: Number })
-  editCount = -1;
-  /** The currently active editor tab. */
-  @property({ type: Number })
-  activeTab = 0;
-
-  /** The plugins to render the layout. */
-  @property({ type: Array })
-  plugins: Plugin[] = [];
-
-  /** The open-scd host element */
-  @property({ type: Object })
-  host!: HTMLElement;
-
-  @property({ type: Object })
-  historyState!: HistoryState;
-
-  @state()
-  validated: Promise<void> = Promise.resolve();
+  private renderPlugging(): TemplateResult {
+    return html` ${this.renderPluginUI()} ${this.renderDownloadUI()} `;
+  }
 
-  @state()
-  shouldValidate = false;
+  /** Renders the "Add Custom Plug-in" UI*/
+  protected renderDownloadUI(): TemplateResult {
+    return html`
+      <oscd-custom-plugin-dialog id="pluginAdd"></oscd-custom-plugin-dialog>
+    `
+  }
 
-  @query('#menu')
-  menuUI!: Drawer;
-  @query('#pluginManager')
-  pluginUI!: Dialog;
-  @query('#pluginList')
-  pluginList!: List;
-  @query('#pluginAdd')
-  pluginDownloadUI!: Dialog;
+  /**
+   * Renders the plug-in management UI (turning plug-ins on/off)
+   */
+  protected renderPluginUI(): TemplateResult {
+    return html`
+      <oscd-plugin-manager id="pluginManager" .plugins=${this.plugins}></oscd-plugin-manager>
+    `
+  }
 
   // Computed properties
 
   get validators(): Plugin[] {
     return this.plugins.filter(
-      plugin => plugin.installed && plugin.kind === 'validator'
+      plugin => plugin.active && plugin.kind === 'validator'
     );
   }
   get menuEntries(): Plugin[] {
     return this.plugins.filter(
-      plugin => plugin.installed && plugin.kind === 'menu'
+      plugin => plugin.active && plugin.kind === 'menu'
     );
   }
   get topMenu(): Plugin[] {
@@ -226,7 +238,7 @@ export class OscdLayout extends LitElement {
 
   get editors(): Plugin[] {
     return this.plugins.filter(
-      plugin => plugin.installed && plugin.kind === 'editor'
+      plugin => plugin.active && plugin.kind === 'editor'
     );
   }
 
@@ -250,50 +262,6 @@ export class OscdLayout extends LitElement {
     fn();
   }
 
-  private handleAddPlugin() {
-    const pluginSrcInput = <TextField>(
-      this.pluginDownloadUI.querySelector('#pluginSrcInput')
-    );
-    const pluginNameInput = <TextField>(
-      this.pluginDownloadUI.querySelector('#pluginNameInput')
-    );
-    const pluginKindList = <List>(
-      this.pluginDownloadUI.querySelector('#pluginKindList')
-    );
-    const requireDoc = <Switch>(
-      this.pluginDownloadUI.querySelector('#requireDoc')
-    );
-    const positionList = <Select>(
-      this.pluginDownloadUI.querySelector('#menuPosition')
-    );
-
-    if (
-      !(
-        pluginSrcInput.checkValidity() &&
-        pluginNameInput.checkValidity() &&
-        pluginKindList.selected &&
-        requireDoc &&
-        positionList.selected
-      )
-    )
-      return;
-
-    this.dispatchEvent(
-      newAddExternalPluginEvent({
-        src: pluginSrcInput.value,
-        name: pluginNameInput.value,
-        kind: <PluginKind>(<ListItem>pluginKindList.selected).value,
-        requireDoc: requireDoc.checked,
-        position: <MenuPosition>positionList.value,
-        installed: true,
-      })
-    );
-
-    this.requestUpdate();
-    this.pluginUI.requestUpdate();
-    this.pluginDownloadUI.close();
-  }
-
   connectedCallback(): void {
     super.connectedCallback();
     this.host.addEventListener('close-drawer', async () => {
@@ -586,224 +554,6 @@ export class OscdLayout extends LitElement {
       }
     }
 
-  /** Renders the "Add Custom Plug-in" UI*/
-  // TODO: this should be its own isolated element
-  protected renderDownloadUI(): TemplateResult {
-    return html`
-      <mwc-dialog id="pluginAdd" heading="${get('plugins.add.heading')}">
-        <div style="display: flex; flex-direction: column; row-gap: 8px;">
-          <p style="color:var(--mdc-theme-error);">
-            ${get('plugins.add.warning')}
-          </p>
-          <mwc-textfield
-            label="${get('plugins.add.name')}"
-            helper="${get('plugins.add.nameHelper')}"
-            required
-            id="pluginNameInput"
-          ></mwc-textfield>
-          <mwc-list id="pluginKindList">
-            <mwc-radio-list-item
-              id="editor"
-              value="editor"
-              hasMeta
-              selected
-              left
-              >${get('plugins.editor')}<mwc-icon slot="meta"
-                >${pluginIcons['editor']}</mwc-icon
-              ></mwc-radio-list-item
-            >
-            <mwc-radio-list-item value="menu" hasMeta left
-              >${get('plugins.menu')}<mwc-icon slot="meta"
-                >${pluginIcons['menu']}</mwc-icon
-              ></mwc-radio-list-item
-            >
-            <div id="menudetails">
-              <mwc-formfield
-                id="enabledefault"
-                label="${get('plugins.requireDoc')}"
-              >
-                <mwc-switch id="requireDoc" checked></mwc-switch>
-              </mwc-formfield>
-              <mwc-select id="menuPosition" value="middle" fixedMenuPosition
-                >${Object.values(menuPosition).map(
-                  menutype =>
-                    html`<mwc-list-item value="${menutype}"
-                      >${get('plugins.' + menutype)}</mwc-list-item
-                    >`
-                )}</mwc-select
-              >
-            </div>
-            <style>
-              #menudetails {
-                display: none;
-                padding: 20px;
-                padding-left: 50px;
-              }
-              #pluginKindList [value="menu"][selected] ~ #menudetails {
-                display: grid;
-              }
-              #enabledefault {
-                padding-bottom: 20px;
-              }
-              #menuPosition {
-                max-width: 250px;
-              }
-            </style>
-            <mwc-radio-list-item id="validator" value="validator" hasMeta left
-              >${get('plugins.validator')}<mwc-icon slot="meta"
-                >${pluginIcons['validator']}</mwc-icon
-              ></mwc-radio-list-item
-            >
-          </mwc-list>
-          <mwc-textfield
-            label="${get('plugins.add.src')}"
-            helper="${get('plugins.add.srcHelper')}"
-            placeholder="http://example.com/plugin.js"
-            type="url"
-            required
-            id="pluginSrcInput"
-          ></mwc-textfield>
-        </div>
-        <mwc-button
-          slot="secondaryAction"
-          dialogAction="close"
-          label="${get('cancel')}"
-        ></mwc-button>
-        <mwc-button
-          slot="primaryAction"
-          icon="add"
-          label="${get('add')}"
-          trailingIcon
-          @click=${() => this.handleAddPlugin()}
-        ></mwc-button>
-      </mwc-dialog>
-    `;
-  }
-
-  // Note: why is the type here if note used?
-  private renderPluginKind(
-    type: PluginKind | MenuPosition,
-    plugins: Plugin[]
-  ): TemplateResult {
-    return html`
-      ${plugins.map( plugin => html`
-        <mwc-check-list-item
-            class="${plugin.official ? 'official' : 'external'}"
-            value="${plugin.src}"
-            ?selected=${plugin.installed}
-            @request-selected=${(e: CustomEvent<{source: string}>) => {
-              if(e.detail.source !== 'interaction'){
-                e.preventDefault();
-                e.stopPropagation();
-                e.stopImmediatePropagation();
-                return false;
-              }
-            }}
-            hasMeta
-            left
-          >
-            <mwc-icon slot="meta">
-              ${plugin.icon || pluginIcons[plugin.kind]}
-            </mwc-icon>
-            ${plugin.name}
-          </mwc-check-list-item>
-        `
-      )}
-    `;
-  }
-
-  /**
-   * Renders the plug-in management UI (turning plug-ins on/off)
-   * TODO: this is big enough to be its own isolated element
-   */
-  protected renderPluginUI(): TemplateResult {
-    return html`
-      <mwc-dialog
-        stacked
-        id="pluginManager"
-        heading="${get('plugins.heading')}"
-      >
-        <mwc-list
-          id="pluginList"
-          multi
-          @selected=${(e: MultiSelectedEvent) =>
-            this.dispatchEvent(newSetPluginsEvent(e.detail.index))}
-        >
-          <mwc-list-item graphic="avatar" noninteractive
-            ><strong>${get(`plugins.editor`)}</strong
-            ><mwc-icon slot="graphic" class="inverted"
-              >${pluginIcons['editor']}</mwc-icon
-            ></mwc-list-item
-          >
-          <li divider role="separator"></li>
-          ${this.renderPluginKind(
-            'editor',
-            this.plugins.filter(p => p.kind === 'editor')
-          )}
-          <mwc-list-item graphic="avatar" noninteractive
-            ><strong>${get(`plugins.menu`)}</strong
-            ><mwc-icon slot="graphic" class="inverted"
-              ><strong>${pluginIcons['menu']}</strong></mwc-icon
-            ></mwc-list-item
-          >
-          <li divider role="separator"></li>
-          ${this.renderPluginKind(
-            'top',
-            this.plugins.filter(p => p.kind === 'menu' && p.position === 'top')
-          )}
-          <li divider role="separator" inset></li>
-          ${this.renderPluginKind(
-            'validator',
-            this.plugins.filter(p => p.kind === 'validator')
-          )}
-          <li divider role="separator" inset></li>
-          ${this.renderPluginKind(
-            'middle',
-            this.plugins.filter(
-              p => p.kind === 'menu' && p.position === 'middle'
-            )
-          )}
-          <li divider role="separator" inset></li>
-          ${this.renderPluginKind(
-            'bottom',
-            this.plugins.filter(
-              p => p.kind === 'menu' && p.position === 'bottom'
-            )
-          )}
-        </mwc-list>
-        <mwc-button
-          slot="secondaryAction"
-          icon="refresh"
-          label="${get('reset')}"
-          @click=${async () => {
-            this.dispatchEvent(newResetPluginsEvent());
-            this.requestUpdate();
-          }}
-          style="--mdc-theme-primary: var(--mdc-theme-error)"
-        >
-        </mwc-button>
-        <mwc-button
-          slot="secondaryAction"
-          icon=""
-          label="${get('close')}"
-          dialogAction="close"
-        ></mwc-button>
-        <mwc-button
-          outlined
-          trailingIcon
-          slot="primaryAction"
-          icon="library_add"
-          label="${get('plugins.add.heading')}&hellip;"
-          @click=${() => this.pluginDownloadUI.show()}
-        >
-        </mwc-button>
-      </mwc-dialog>
-    `;
-  }
-
-  private renderPlugging(): TemplateResult {
-    return html` ${this.renderPluginUI()} ${this.renderDownloadUI()} `;
-  }
 
 
 
diff --git a/packages/openscd/src/addons/plugin-manager/custom-plugin-dialog.ts b/packages/openscd/src/addons/plugin-manager/custom-plugin-dialog.ts
new file mode 100644
index 0000000000..826b891db3
--- /dev/null
+++ b/packages/openscd/src/addons/plugin-manager/custom-plugin-dialog.ts
@@ -0,0 +1,207 @@
+
+import {
+  customElement,
+  html,
+  LitElement,
+  query,
+  TemplateResult,
+  css,
+} from 'lit-element';
+import { get } from 'lit-translate';
+import {
+  newAddExternalPluginEvent,
+  pluginIcons
+} from '../../open-scd.js';
+
+import {
+  MenuPosition,
+  menuPosition,
+  PluginKind
+} from "../../plugin.js";
+
+import type { Button } from '@material/mwc-button';
+import type { Dialog } from '@material/mwc-dialog';
+import { List } from '@material/mwc-list';
+import type { ListItem } from '@material/mwc-list/mwc-list-item';
+import type { Select } from '@material/mwc-select';
+import type { Switch } from '@material/mwc-switch';
+import type { TextField } from '@material/mwc-textfield';
+
+import '@material/mwc-dialog';
+import '@material/mwc-drawer';
+import '@material/mwc-list';
+import '@material/mwc-select';
+import '@material/mwc-switch';
+import '@material/mwc-textfield';
+
+
+@customElement('oscd-custom-plugin-dialog')
+export class OscdCustomPluginDialog extends LitElement {
+
+  @query('#dialog') dialog!: Dialog
+  @query('#pluginSrcInput') pluginSrcInput!: TextField
+  @query('#pluginNameInput') pluginNameInput!: TextField
+  @query('#pluginKindList') pluginKindList!: List
+  @query('#requireDoc') requireDoc!: Switch
+  @query('#positionList') positionList!: Select
+  @query('#addButton') addButton!: Button
+
+  render(): TemplateResult {
+    return html`
+      <mwc-dialog id="dialog" heading="${get('plugins.add.heading')}">
+        <div style="display: flex; flex-direction: column; row-gap: 8px;">
+          <p style="color:var(--mdc-theme-error);">
+            ${get('plugins.add.warning')}
+          </p>
+          <mwc-textfield
+            label="${get('plugins.add.name')}"
+            helper="${get('plugins.add.nameHelper')}"
+            required
+            id="pluginNameInput"
+          ></mwc-textfield>
+          <mwc-list id="pluginKindList">
+            <mwc-radio-list-item
+              id="editor"
+              value="editor"
+              hasMeta
+              selected
+              left
+            >
+              ${get('plugins.editor')}
+              <mwc-icon slot="meta">
+                ${pluginIcons['editor']}
+              </mwc-icon>
+            </mwc-radio-list-item>
+            <mwc-radio-list-item value="menu" hasMeta left>
+              ${get('plugins.menu')}
+            <mwc-icon slot="meta">
+              ${pluginIcons['menu']}
+            </mwc-icon>
+            </mwc-radio-list-item>
+            <div id="menudetails">
+              <mwc-formfield
+                id="enabledefault"
+                label="${get('plugins.requireDoc')}"
+              >
+                <mwc-switch id="requireDoc" checked></mwc-switch>
+              </mwc-formfield>
+              <mwc-select id="positionList" value="middle" fixedpositionList>
+                ${Object.values(menuPosition).map(
+                  menutype =>
+                    html`<mwc-list-item value="${menutype}"
+                      >${get('plugins.' + menutype)}</mwc-list-item
+                    >`
+                )}
+              </mwc-select>
+            </div>
+            <style>
+              #menudetails {
+                display: none;
+                padding: 20px;
+                padding-left: 50px;
+              }
+              #pluginKindList [value="menu"][selected] ~ #menudetails {
+                display: grid;
+              }
+              #enabledefault {
+                padding-bottom: 20px;
+              }
+              #positionList {
+                max-width: 250px;
+              }
+            </style>
+            <mwc-radio-list-item id="validator" value="validator" hasMeta left>
+              ${get('plugins.validator')}
+              <mwc-icon slot="meta">
+                ${pluginIcons['validator']}
+              </mwc-icon>
+            </mwc-radio-list-item>
+          </mwc-list>
+          <mwc-textfield
+            label="${get('plugins.add.src')}"
+            helper="${get('plugins.add.srcHelper')}"
+            placeholder="http://example.com/plugin.js"
+            type="url"
+            required
+            id="pluginSrcInput">
+          </mwc-textfield>
+        </div>
+        <mwc-button
+          slot="secondaryAction"
+          dialogAction="close"
+          label="${get('cancel')}">
+        </mwc-button>
+        <mwc-button
+          id="addButton"
+          slot="primaryAction"
+          icon="add"
+          label="${get('add')}"
+          trailingIcon
+          @click=${() => this.handleAddPlugin()}>
+        </mwc-button>
+      </mwc-dialog>
+    `;
+  }
+
+  static styles = css`
+
+    mwc-dialog {
+      --mdc-dialog-max-width: 98vw;
+    }
+
+    mwc-dialog > form {
+      display: flex;
+      flex-direction: column;
+    }
+
+    mwc-dialog > form > * {
+      display: block;
+      margin-top: 16px;
+    }
+  `
+
+  public close(){
+    this.dialog.close()
+  }
+
+  public show(){
+    this.dialog.show()
+  }
+
+  get open(){
+    return this.dialog.open
+  }
+
+  private handleAddPlugin() {
+
+    if (
+      !(
+        this.pluginSrcInput.checkValidity() &&
+        this.pluginNameInput.checkValidity() &&
+        this.pluginKindList.selected &&
+        this.requireDoc &&
+        this.positionList.selected
+      )
+    )
+      return;
+
+    this.dispatchEvent(
+      newAddExternalPluginEvent({
+        src: this.pluginSrcInput.value,
+        name: this.pluginNameInput.value,
+        kind: <PluginKind>(<ListItem>this.pluginKindList.selected).value,
+        requireDoc: this.requireDoc.checked,
+        position: <MenuPosition>this.positionList.value,
+        active: true,
+        // this is an added plugin and will be remove by reset either way
+        activeByDefault: false,
+      })
+    );
+
+    this.requestUpdate();
+    this.dialog.close();
+  }
+
+}
+
+
diff --git a/packages/openscd/src/addons/plugin-manager/plugin-manager.ts b/packages/openscd/src/addons/plugin-manager/plugin-manager.ts
new file mode 100644
index 0000000000..a90c8d63b8
--- /dev/null
+++ b/packages/openscd/src/addons/plugin-manager/plugin-manager.ts
@@ -0,0 +1,186 @@
+import {
+  customElement,
+  html,
+  LitElement,
+  property,
+  query,
+  TemplateResult,
+  css
+} from 'lit-element';
+import { get } from 'lit-translate';
+
+import type { ActionDetail } from '@material/mwc-list';
+import type { MultiSelectedEvent } from '@material/mwc-list/mwc-list-foundation.js';
+import type { Dialog } from '@material/mwc-dialog';
+import '@material/mwc-dialog';
+import '@material/mwc-list';
+import type {List} from '@material/mwc-list';
+
+import {
+  newResetPluginsEvent,
+  newSetPluginsEvent,
+  pluginIcons
+} from '../../open-scd.js';
+
+import {
+  MenuPosition,
+  Plugin,
+} from "../../plugin.js";
+
+@customElement('oscd-plugin-manager')
+export class OscdPluginManager extends LitElement {
+
+  /** The plugins to render the layout. */
+  @property({ type: Array }) plugins: Plugin[] = [];
+  @query('#plugin-manager-root') root!: Dialog
+  @query('#pluginList') pluginList!: List
+
+  render(): TemplateResult {
+      return html`
+        <mwc-dialog
+          stacked
+          id="plugin-manager-root"
+          heading="${get('plugins.heading')}"
+        >
+          <mwc-list
+            id="pluginList"
+            multi
+            @selected=${(e: MultiSelectedEvent) => {
+              const selectedPlugins = this.pluginList.items
+              .filter((item, index) => e.detail.index.has(index))
+              // @ts-expect-error: we add plugin to the list item
+              .map(item => item.plugin) as Plugin[]
+
+              this.dispatchEvent(newSetPluginsEvent(selectedPlugins))
+            }}
+          >
+            <mwc-list-item graphic="avatar" noninteractive>
+              <strong>${get(`plugins.editor`)}</strong>
+              <mwc-icon slot="graphic" class="inverted">
+                ${pluginIcons['editor']}
+              </mwc-icon>
+            </mwc-list-item>
+
+            <li divider role="separator"></li>
+
+            ${this.generateEditorListItems()}
+
+            <mwc-list-item graphic="avatar" noninteractive>
+              <strong>${get(`plugins.menu`)}</strong>
+              <mwc-icon slot="graphic" class="inverted">
+                <strong>${pluginIcons['menu']}</strong></mwc-icon>
+              </mwc-list-item>
+            <li divider role="separator"></li>
+
+            ${this.generateMenuListItems('top')}
+
+            <li divider role="separator" inset></li>
+
+            ${this.generateValidatorListItems()}
+
+            <li divider role="separator" inset></li>
+
+            ${this.generateMenuListItems('middle')}
+
+            <li divider role="separator" inset></li>
+
+            ${this.generateMenuListItems('bottom')}
+
+          </mwc-list>
+          <mwc-button
+            slot="secondaryAction"
+            icon="refresh"
+            label="${get('reset')}"
+            @click=${async () => {
+              this.dispatchEvent(newResetPluginsEvent());
+              this.requestUpdate();
+            }}
+            style="--mdc-theme-primary: var(--mdc-theme-error)"
+          >
+          </mwc-button>
+          <mwc-button
+            slot="secondaryAction"
+            icon=""
+            label="${get('close')}"
+            dialogAction="close">
+          </mwc-button>
+          <mwc-button
+            outlined
+            trailingIcon
+            slot="primaryAction"
+            icon="library_add"
+            label="${get('plugins.add.heading')}&hellip;"
+            @click=${() => this.dispatchOpenCustomPluginDialogEvent()}>
+          </mwc-button>
+        </mwc-dialog>
+      `;
+  }
+
+  static styles = css`
+    mwc-dialog {
+      --mdc-dialog-max-width: 98vw;
+    }
+  `
+
+  public show(){
+    this.root.show()
+  }
+
+
+  private generateEditorListItems(): TemplateResult[] {
+    return this.plugins
+      .filter(p => p.kind === 'editor')
+      .map(this.renderPluginListItem)
+  }
+
+  private generateMenuListItems(position: MenuPosition): TemplateResult[] {
+    return this.plugins
+      .filter(p => p.kind === 'menu' && p.position === position)
+      .map(this.renderPluginListItem)
+  }
+
+  private generateValidatorListItems(): TemplateResult[] {
+    return this.plugins
+      .filter(p => p.kind === 'validator')
+      .map(this.renderPluginListItem)
+  }
+
+  private dispatchOpenCustomPluginDialogEvent(): void {
+    const event = new CustomEvent('open-plugin-download', {
+      bubbles: true,
+      composed: true,
+    });
+
+    this.dispatchEvent(event);
+  }
+
+  private renderPluginListItem(plugin?: Plugin): TemplateResult {
+    if(!plugin){ return html`` }
+
+    return html`
+      <mwc-check-list-item
+          class="${plugin.official ? 'official' : 'external'}"
+          value="${plugin.src}"
+          .plugin=${plugin}
+          ?selected=${plugin.active}
+          @request-selected=${(e: CustomEvent<{source: string}>) => {
+            if(e.detail.source !== 'interaction'){
+              e.preventDefault();
+              e.stopPropagation();
+              e.stopImmediatePropagation();
+              return false;
+            }
+          }}
+          hasMeta
+          left
+        >
+          <mwc-icon slot="meta">
+            ${plugin.icon || pluginIcons[plugin.kind]}
+          </mwc-icon>
+          ${plugin.name}
+        </mwc-check-list-item>
+
+    `;
+  }
+
+}
diff --git a/packages/openscd/src/open-scd.ts b/packages/openscd/src/open-scd.ts
index 6b0f458d3a..0c2db48a82 100644
--- a/packages/openscd/src/open-scd.ts
+++ b/packages/openscd/src/open-scd.ts
@@ -1,4 +1,3 @@
-//#region import
 import {
   customElement,
   html,
@@ -53,7 +52,6 @@ import { InstalledOfficialPlugin, MenuPosition, PluginKind, Plugin } from "./plu
 import { ConfigurePluginEvent, ConfigurePluginDetail, newConfigurePluginEvent } from './plugin.events.js';
 import { newLogEvent } from '@openscd/core/foundation/deprecated/history';
 
-//#endregion import
 
 
 /** The `<open-scd>` custom element is the main entry point of the
@@ -76,6 +74,7 @@ export class OpenSCD extends LitElement {
               <oscd-layout
                 @add-external-plugin=${this.handleAddExternalPlugin}
                 @oscd-configure-plugin=${this.handleConfigurationPluginEvent}
+                @set-plugins=${ (e: SetPluginsEvent) => this.setPlugins(e.detail.selectedPlugins) }
                 .host=${this}
                 .doc=${this.doc}
                 .docName=${this.docName}
@@ -122,6 +121,8 @@ export class OpenSCD extends LitElement {
     this.dispatchEvent(newPendingStateEvent(this.loadDoc(value)));
   }
 
+  @state() private storedPlugins: Plugin[] = [];
+
   /** Loads and parses an `XMLDocument` after [[`src`]] has changed. */
   private async loadDoc(src: string): Promise<void> {
     const response = await fetch(src);
@@ -185,9 +186,6 @@ export class OpenSCD extends LitElement {
 
     // TODO: let Lit handle the event listeners, move to render()
     this.addEventListener('reset-plugins', this.resetPlugins);
-    this.addEventListener('set-plugins', (e: SetPluginsEvent) => {
-      this.setPlugins(e.detail.indices);
-    });
     this.addEventListener(historyStateEvent, (e: CustomEvent<HistoryState>) => {
       this.historyState = e.detail;
       this.requestUpdate();
@@ -195,9 +193,6 @@ export class OpenSCD extends LitElement {
   }
 
 
-
-
-
   /**
    *
    * @param name
@@ -216,12 +211,12 @@ export class OpenSCD extends LitElement {
     const newPlugins = this.storedPlugins.filter(
       p => p.name !== name || p.kind !== kind
     );
-    this.storePlugins(newPlugins);
+    this.updateStoredPlugins(newPlugins);
   }
 
   private addPlugin(plugin: Plugin) {
     const newPlugins = [...this.storedPlugins, plugin];
-    this.storePlugins(newPlugins);
+    this.updateStoredPlugins(newPlugins);
   }
 
   /**
@@ -249,29 +244,30 @@ export class OpenSCD extends LitElement {
     const newPlugins = [...storedPlugins]
     newPlugins.splice(pluginIndex, 1, changedPlugin)
 
-    this.storePlugins(newPlugins);
+    // this.storePlugins(newPlugins);
+    this.updateStoredPlugins(newPlugins);
   }
 
   private resetPlugins(): void {
-    this.storePlugins(
-      (this.getBuiltInPlugins() as Plugin[]).concat(this.parsedPlugins).map(plugin => {
-        return {
-          ...plugin,
-          installed: plugin.default ?? false,
-        };
-      })
-    );
+    const builtInPlugins = this.getBuiltInPlugins()
+    const allPlugins = [...builtInPlugins, ...this.parsedPlugins]
+
+    const newPluginConfigs = allPlugins.map(plugin => {
+      return {
+        ...plugin,
+        active: plugin.activeByDefault ?? false,
+      }
+    })
+
+    this.storePlugins(newPluginConfigs)
   }
 
   /**
    * @prop {PluginSet} plugins - Set of plugins that are used by OpenSCD
    */
-  @property({ type: Object })
-  plugins: PluginSet = { menu: [], editor: [] };
-
+  @property({ type: Object }) plugins: PluginSet = { menu: [], editor: [] };
   get parsedPlugins(): Plugin[] {
-
-    const menuPlugins = this.plugins.menu.map((plugin: CorePlugin) => {
+    const menuPlugins: Plugin[] = this.plugins.menu.map((plugin) => {
       let newPosition: MenuPosition | undefined = plugin.position as MenuPosition;
       if(typeof plugin.position === 'number') {
         newPosition = undefined
@@ -281,29 +277,32 @@ export class OpenSCD extends LitElement {
           ...plugin,
           position: newPosition,
           kind: 'menu' as PluginKind,
-          installed: plugin.active ?? false,
+          active: plugin.active ?? false,
         }
       })
 
-    const editorPlugins = this.plugins.editor.map((plugin: CorePlugin) => ({
-      ...plugin,
-      position: undefined,
-      kind: 'editor' as PluginKind,
-      installed: plugin.active ?? false,
-    }))
+    const editorPlugins: Plugin[] = this.plugins.editor.map((plugin) => {
+      const editorPlugin: Plugin = {
+        ...plugin,
+        position: undefined,
+        kind: 'editor' as PluginKind,
+        active: plugin.active ?? false,
+      }
+      return editorPlugin
+    })
 
     const allPlugnis = [...menuPlugins, ...editorPlugins]
     return allPlugnis
   }
 
 
-  @state() private storedPlugins: Plugin[] = [];
+
   private updateStoredPlugins(newPlugins: Plugin[]) {
     //
     // Generate content of each plugin
     //
     const plugins = newPlugins.map(plugin => {
-      const isInstalled = plugin.src && plugin.installed
+      const isInstalled = plugin.src && plugin.active
       if(!isInstalled) { return plugin }
 
       return this.addContent(plugin)
@@ -324,7 +323,6 @@ export class OpenSCD extends LitElement {
           ...plugin,
         };
     })
-
     this.storePlugins(mergedPlugins);
   }
 
@@ -353,13 +351,19 @@ export class OpenSCD extends LitElement {
     return docs;
   }
 
-  private setPlugins(indices: Set<number>) {
-    const newPlugins = this.storedPlugins.map((plugin, index) => {
+  private setPlugins(selectedPlugins: Plugin[]) {
+
+    const newPlugins: Plugin[] = this.storedPlugins.map((storedPlugin) => {
+      const isSelected = selectedPlugins.some( (selectedPlugin) => {
+        return selectedPlugin.name === storedPlugin.name
+            && selectedPlugin.src === storedPlugin.src
+      })
       return {
-        ...plugin,
-        installed: indices.has(index)
-      };
-    });
+        ...storedPlugin,
+        active: isSelected
+      }
+    })
+
     this.updateStoredPlugins(newPlugins);
   }
 
@@ -373,23 +377,20 @@ export class OpenSCD extends LitElement {
     const userInstalledPlugins = localPluginConfigs.filter((p) => {
       return !this.getBuiltInPlugins().some(b => b.src === p.src)
     })
-
     const mergedBuiltInPlugins = this.getBuiltInPlugins().map((builtInPlugin) => {
-      const noopOverwrite = {}
-      const overwrite = overwritesOfBultInPlugins
-        .find(p => p.src === builtInPlugin.src)
-        ?? noopOverwrite
+      let overwrite = overwritesOfBultInPlugins.find(p => p.src === builtInPlugin.src)
 
-      return {
+      const mergedPlugin: Plugin = {
         ...builtInPlugin,
         ...overwrite,
+        active: overwrite?.active ?? builtInPlugin.activeByDefault,
       }
+
+      return mergedPlugin
     })
 
     const mergedPlugins = [...mergedBuiltInPlugins, ...userInstalledPlugins]
 
-    // TODO: kind is string and enum, figour out later
-    // @ts-expect-error
     this.updateStoredPlugins(mergedPlugins)
   }
 
@@ -404,7 +405,7 @@ export class OpenSCD extends LitElement {
   }
 
   protected getBuiltInPlugins(): CorePlugin[] {
-    return builtinPlugins as CorePlugin[]
+    return builtinPlugins
   }
 
   private addContent(plugin: Omit<Plugin, 'content'>): Plugin {
@@ -528,16 +529,16 @@ export function newAddExternalPluginEvent(
 }
 
 export interface SetPluginsDetail {
-  indices: Set<number>;
+  selectedPlugins: Plugin[];
 }
 
 export type SetPluginsEvent = CustomEvent<SetPluginsDetail>;
 
-export function newSetPluginsEvent(indices: Set<number>): SetPluginsEvent {
+export function newSetPluginsEvent(selectedPlugins: Plugin[]): SetPluginsEvent {
   return new CustomEvent<SetPluginsDetail>('set-plugins', {
     bubbles: true,
     composed: true,
-    detail: { indices },
+    detail: { selectedPlugins },
   });
 }
 
diff --git a/packages/openscd/src/plugin.ts b/packages/openscd/src/plugin.ts
index 60e4fc3a02..41e127a9d1 100644
--- a/packages/openscd/src/plugin.ts
+++ b/packages/openscd/src/plugin.ts
@@ -1,25 +1,29 @@
 import { TemplateResult } from 'lit-element';
+import { Plugin as CorePlugin } from "@openscd/core"
 
-export type Plugin = {
-  name: string;
-  src: string;
-  icon?: string;
-  default?: boolean;
-  kind: PluginKind;
-  requireDoc?: boolean;
-  position?: MenuPosition;
-  installed: boolean;
+export type Plugin = CorePlugin & {
   official?: boolean;
+  active: boolean;
   content?: () => TemplateResult;
 };
 
+export type PluginConfig = PluginConfigNotMenu | PluginConfigMenu
+
+export type PluginConfigNotMenu = Omit<Plugin, "position" | "active"> & {
+  kind: 'editor' | 'validator';
+}
+
+export type PluginConfigMenu = Omit<Plugin, "active"> & {
+  kind: 'menu';
+  position: MenuPosition;
+}
+
 export type InstalledOfficialPlugin = Plugin & {
   src: string;
   official: true;
   installed: boolean;
 };
 
-
 export type PluginKind = 'editor' | 'menu' | 'validator';
 export const menuPosition = ['top', 'middle', 'bottom'] as const;
 export type MenuPosition = (typeof menuPosition)[number];
diff --git a/packages/openscd/src/plugins.ts b/packages/openscd/src/plugins.ts
index b1447c9e1d..3c9a9cf8ce 100644
--- a/packages/openscd/src/plugins.ts
+++ b/packages/openscd/src/plugins.ts
@@ -1,13 +1,15 @@
+import { PluginConfig } from './plugin.js';
+
 export function generatePluginPath(plugin: string): string {
   return location.origin+location.pathname+plugin;
 }
 
-export const officialPlugins = [
+export const officialPlugins: PluginConfig[] = [
   {
     name: 'IED',
     src: generatePluginPath('plugins/src/editors/IED.js'),
     icon: 'developer_board',
-    default: true,
+    activeByDefault: true,
     kind: 'editor',
     requireDoc: true,
   },
@@ -15,7 +17,7 @@ export const officialPlugins = [
     name: 'Substation',
     src: generatePluginPath('plugins/src/editors/Substation.js'),
     icon: 'margin',
-    default: true,
+    activeByDefault: true,
     kind: 'editor',
     requireDoc: true,
   },
@@ -23,7 +25,7 @@ export const officialPlugins = [
     name: 'Single Line Diagram',
     src: generatePluginPath('plugins/src/editors/SingleLineDiagram.js'),
     icon: 'edit',
-    default: false,
+    activeByDefault: false,
     kind: 'editor',
     requireDoc: true,
   },
@@ -31,7 +33,7 @@ export const officialPlugins = [
     name: 'Subscriber Message Binding (GOOSE)',
     src: generatePluginPath('plugins/src/editors/GooseSubscriberMessageBinding.js'),
     icon: 'link',
-    default: false,
+    activeByDefault: false,
     kind: 'editor',
     requireDoc: true,
   },
@@ -39,7 +41,7 @@ export const officialPlugins = [
     name: 'Subscriber Data Binding (GOOSE)',
     src: generatePluginPath('plugins/src/editors/GooseSubscriberDataBinding.js'),
     icon: 'link',
-    default: false,
+    activeByDefault: false,
     kind: 'editor',
     requireDoc: true,
   },
@@ -47,7 +49,7 @@ export const officialPlugins = [
     name: 'Subscriber Later Binding (GOOSE)',
     src: generatePluginPath('plugins/src/editors/GooseSubscriberLaterBinding.js'),
     icon: 'link',
-    default: true,
+    activeByDefault: true,
     kind: 'editor',
     requireDoc: true,
   },
@@ -55,7 +57,7 @@ export const officialPlugins = [
     name: 'Subscriber Message Binding (SMV)',
     src: generatePluginPath('plugins/src/editors/SMVSubscriberMessageBinding.js'),
     icon: 'link',
-    default: false,
+    activeByDefault: false,
     kind: 'editor',
     requireDoc: true,
   },
@@ -63,7 +65,7 @@ export const officialPlugins = [
     name: 'Subscriber Data Binding (SMV)',
     src: generatePluginPath('plugins/src/editors/SMVSubscriberDataBinding.js'),
     icon: 'link',
-    default: false,
+    activeByDefault: false,
     kind: 'editor',
     requireDoc: true,
   },
@@ -71,7 +73,7 @@ export const officialPlugins = [
     name: 'Subscriber Later Binding (SMV)',
     src: generatePluginPath('plugins/src/editors/SMVSubscriberLaterBinding.js'),
     icon: 'link',
-    default: true,
+    activeByDefault: true,
     kind: 'editor',
     requireDoc: true,
   },
@@ -79,7 +81,7 @@ export const officialPlugins = [
     name: 'Communication',
     src: generatePluginPath('plugins/src/editors/Communication.js'),
     icon: 'settings_ethernet',
-    default: true,
+    activeByDefault: true,
     kind: 'editor',
     requireDoc: true,
   },
@@ -87,7 +89,7 @@ export const officialPlugins = [
     name: '104',
     src: generatePluginPath('plugins/src/editors/Protocol104.js'),
     icon: 'settings_ethernet',
-    default: false,
+    activeByDefault: false,
     kind: 'editor',
     requireDoc: true,
   },
@@ -95,7 +97,7 @@ export const officialPlugins = [
     name: 'Templates',
     src: generatePluginPath('plugins/src/editors/Templates.js'),
     icon: 'copy_all',
-    default: true,
+    activeByDefault: true,
     kind: 'editor',
     requireDoc: true,
   },
@@ -103,7 +105,7 @@ export const officialPlugins = [
     name: 'Publisher',
     src: generatePluginPath('plugins/src/editors/Publisher.js'),
     icon: 'publish',
-    default: false,
+    activeByDefault: false,
     kind: 'editor',
     requireDoc: true,
   },
@@ -111,7 +113,7 @@ export const officialPlugins = [
     name: 'Cleanup',
     src: generatePluginPath('plugins/src/editors/Cleanup.js'),
     icon: 'cleaning_services',
-    default: false,
+    activeByDefault: false,
     kind: 'editor',
     requireDoc: true,
   },
@@ -119,7 +121,7 @@ export const officialPlugins = [
     name: 'Open project',
     src: generatePluginPath('plugins/src/menu/OpenProject.js'),
     icon: 'folder_open',
-    default: true,
+    activeByDefault: true,
     kind: 'menu',
     requireDoc: false,
     position: 'top',
@@ -128,16 +130,25 @@ export const officialPlugins = [
     name: 'New project',
     src: generatePluginPath('plugins/src/menu/NewProject.js'),
     icon: 'create_new_folder',
-    default: true,
+    activeByDefault: true,
     kind: 'menu',
     requireDoc: false,
     position: 'top',
   },
+  {
+    name: 'Plugin Store (Beta)',
+    src: 'https://sprinteins.github.io/oscd-plugin-store/index.js',
+    icon: 'shopping_bag',
+    activeByDefault: false,
+    kind: 'menu',
+    requireDoc: false,
+    position: 'bottom',
+  },
   {
     name: 'Save project',
     src: generatePluginPath('plugins/src/menu/SaveProject.js'),
     icon: 'save',
-    default: true,
+    activeByDefault: true,
     kind: 'menu',
     requireDoc: true,
     position: 'top',
@@ -146,21 +157,21 @@ export const officialPlugins = [
     name: 'Validate Schema',
     src: generatePluginPath('plugins/src/validators/ValidateSchema.js'),
     icon: 'rule_folder',
-    default: true,
+    activeByDefault: true,
     kind: 'validator',
   },
   {
     name: 'Validate Templates',
     src: generatePluginPath('plugins/src/validators/ValidateTemplates.js'),
     icon: 'rule_folder',
-    default: true,
+    activeByDefault: true,
     kind: 'validator',
   },
   {
     name: 'Import IEDs',
     src: generatePluginPath('plugins/src/menu/ImportIEDs.js'),
     icon: 'snippet_folder',
-    default: true,
+    activeByDefault: true,
     kind: 'menu',
     requireDoc: true,
     position: 'middle',
@@ -169,7 +180,7 @@ export const officialPlugins = [
     name: 'Create Virtual IED',
     src: generatePluginPath('plugins/src/menu/VirtualTemplateIED.js'),
     icon: 'developer_board',
-    default: false,
+    activeByDefault: false,
     kind: 'menu',
     requireDoc: true,
     position: 'middle',
@@ -177,7 +188,7 @@ export const officialPlugins = [
   {
     name: 'Subscriber Update',
     src: generatePluginPath('plugins/src/menu/SubscriberInfo.js'),
-    default: true,
+    activeByDefault: true,
     kind: 'menu',
     requireDoc: true,
     position: 'middle',
@@ -185,7 +196,7 @@ export const officialPlugins = [
   {
     name: 'Update desc (ABB)',
     src: generatePluginPath('plugins/src/menu/UpdateDescriptionABB.js'),
-    default: false,
+    activeByDefault: false,
     kind: 'menu',
     requireDoc: true,
     position: 'middle',
@@ -193,7 +204,7 @@ export const officialPlugins = [
   {
     name: 'Update desc (SEL)',
     src: generatePluginPath('plugins/src/menu/UpdateDescriptionSEL.js'),
-    default: false,
+    activeByDefault: false,
     kind: 'menu',
     requireDoc: true,
     position: 'middle',
@@ -202,7 +213,7 @@ export const officialPlugins = [
     name: 'Merge Project',
     src: generatePluginPath('plugins/src/menu/Merge.js'),
     icon: 'merge_type',
-    default: true,
+    activeByDefault: true,
     kind: 'menu',
     requireDoc: true,
     position: 'middle',
@@ -211,7 +222,7 @@ export const officialPlugins = [
     name: 'Update Substation',
     src: generatePluginPath('plugins/src/menu/UpdateSubstation.js'),
     icon: 'merge_type',
-    default: true,
+    activeByDefault: true,
     kind: 'menu',
     requireDoc: true,
     position: 'middle',
@@ -220,7 +231,7 @@ export const officialPlugins = [
     name: 'Compare IED',
     src: generatePluginPath('plugins/src/menu/CompareIED.js'),
     icon: 'compare_arrows',
-    default: true,
+    activeByDefault: true,
     kind: 'menu',
     requireDoc: true,
     position: 'middle',
@@ -229,7 +240,7 @@ export const officialPlugins = [
     name: 'Show SCL History',
     src: generatePluginPath('plugins/src/menu/SclHistory.js'),
     icon: 'history_toggle_off',
-    default: true,
+    activeByDefault: true,
     kind: 'menu',
     requireDoc: true,
     position: 'bottom',
@@ -238,7 +249,7 @@ export const officialPlugins = [
     name: 'Help',
     src: generatePluginPath('plugins/src/menu/Help.js'),
     icon: 'help',
-    default: true,
+    activeByDefault: true,
     kind: 'menu',
     requireDoc: false,
     position: 'bottom',
@@ -247,7 +258,7 @@ export const officialPlugins = [
     name: 'Export Communication Section',
     src: generatePluginPath('plugins/src/menu/ExportCommunication.js'),
     icon: 'sim_card_download',
-    default: false,
+    activeByDefault: false,
     kind: 'menu',
     requireDoc: true,
     position: 'middle',
diff --git a/packages/openscd/test/integration/__snapshots__/open-scd.test.snap.js b/packages/openscd/test/integration/__snapshots__/open-scd.test.snap.js
index fdf0469dcd..4c98550567 100644
--- a/packages/openscd/test/integration/__snapshots__/open-scd.test.snap.js
+++ b/packages/openscd/test/integration/__snapshots__/open-scd.test.snap.js
@@ -76,18 +76,6 @@ snapshots["open-scd renders menu plugins passed down as props and it looks like
       Menu
     </span>
     <mwc-list wrapfocus="">
-      <li
-        divider=""
-        padded=""
-        role="separator"
-      >
-      </li>
-      <li
-        divider=""
-        padded=""
-        role="separator"
-      >
-      </li>
       <li
         divider=""
         padded=""
@@ -96,793 +84,59 @@ snapshots["open-scd renders menu plugins passed down as props and it looks like
       </li>
       <mwc-list-item
         aria-disabled="false"
-        class="static"
-        data-name="settings.title"
+        class="top"
+        data-name="Open project"
         graphic="icon"
-        iconid="settings"
+        iconid="folder_open"
         mwc-list-item=""
         tabindex="0"
       >
         <mwc-icon slot="graphic">
-          settings
+          folder_open
         </mwc-icon>
         <span>
-          Settings
+          Open project
         </span>
       </mwc-list-item>
+      <oscd-plugind0b9863131b4146e class="menu plugin">
+      </oscd-plugind0b9863131b4146e>
       <mwc-list-item
         aria-disabled="false"
-        class="static"
-        data-name="plugins.heading"
+        class="top"
+        data-name="New project"
         graphic="icon"
-        iconid="extension"
+        iconid="create_new_folder"
         mwc-list-item=""
         tabindex="-1"
       >
         <mwc-icon slot="graphic">
-          extension
+          create_new_folder
         </mwc-icon>
         <span>
-          Plug-ins
+          New project
         </span>
       </mwc-list-item>
-    </mwc-list>
-  </mwc-drawer>
-  <div class="landing">
-  </div>
-  <mwc-dialog
-    heading="Plug-ins"
-    id="pluginManager"
-    stacked=""
-  >
-    <mwc-list
-      id="pluginList"
-      multi=""
-    >
+      <oscd-plugin9b4f3043bce10a59 class="menu plugin">
+      </oscd-plugin9b4f3043bce10a59>
       <mwc-list-item
-        aria-disabled="false"
-        graphic="avatar"
-        noninteractive=""
-        tabindex="-1"
-      >
-        <strong>
-          Editor tab
-        </strong>
-        <mwc-icon
-          class="inverted"
-          slot="graphic"
-        >
-          tab
-        </mwc-icon>
-      </mwc-list-item>
-      <li
-        divider=""
-        role="separator"
-      >
-      </li>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="0"
-        value="http://localhost:8000/plugins/src/editors/IED.js"
-      >
-        <mwc-icon slot="meta">
-          developer_board
-        </mwc-icon>
-        IED
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/editors/Substation.js"
-      >
-        <mwc-icon slot="meta">
-          margin
-        </mwc-icon>
-        Substation
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/editors/SingleLineDiagram.js"
-      >
-        <mwc-icon slot="meta">
-          edit
-        </mwc-icon>
-        Single Line Diagram
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/editors/GooseSubscriberMessageBinding.js"
-      >
-        <mwc-icon slot="meta">
-          link
-        </mwc-icon>
-        Subscriber Message Binding (GOOSE)
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/editors/GooseSubscriberDataBinding.js"
-      >
-        <mwc-icon slot="meta">
-          link
-        </mwc-icon>
-        Subscriber Data Binding (GOOSE)
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/editors/GooseSubscriberLaterBinding.js"
-      >
-        <mwc-icon slot="meta">
-          link
-        </mwc-icon>
-        Subscriber Later Binding (GOOSE)
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/editors/SMVSubscriberMessageBinding.js"
-      >
-        <mwc-icon slot="meta">
-          link
-        </mwc-icon>
-        Subscriber Message Binding (SMV)
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/editors/SMVSubscriberDataBinding.js"
-      >
-        <mwc-icon slot="meta">
-          link
-        </mwc-icon>
-        Subscriber Data Binding (SMV)
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/editors/SMVSubscriberLaterBinding.js"
-      >
-        <mwc-icon slot="meta">
-          link
-        </mwc-icon>
-        Subscriber Later Binding (SMV)
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/editors/Communication.js"
-      >
-        <mwc-icon slot="meta">
-          settings_ethernet
-        </mwc-icon>
-        Communication
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/editors/Protocol104.js"
-      >
-        <mwc-icon slot="meta">
-          settings_ethernet
-        </mwc-icon>
-        104
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/editors/Templates.js"
-      >
-        <mwc-icon slot="meta">
-          copy_all
-        </mwc-icon>
-        Templates
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/editors/Publisher.js"
-      >
-        <mwc-icon slot="meta">
-          publish
-        </mwc-icon>
-        Publisher
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/editors/Cleanup.js"
-      >
-        <mwc-icon slot="meta">
-          cleaning_services
-        </mwc-icon>
-        Cleanup
-      </mwc-check-list-item>
-      <mwc-list-item
-        aria-disabled="false"
-        graphic="avatar"
-        noninteractive=""
-        tabindex="-1"
-      >
-        <strong>
-          Menu entry
-        </strong>
-        <mwc-icon
-          class="inverted"
-          slot="graphic"
-        >
-          <strong>
-            play_circle
-          </strong>
-        </mwc-icon>
-      </mwc-list-item>
-      <li
-        divider=""
-        role="separator"
-      >
-      </li>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/OpenProject.js"
-      >
-        <mwc-icon slot="meta">
-          folder_open
-        </mwc-icon>
-        Open project
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/NewProject.js"
-      >
-        <mwc-icon slot="meta">
-          create_new_folder
-        </mwc-icon>
-        New project
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
+        aria-disabled="true"
+        class="top"
+        data-name="Save project"
+        disabled=""
+        graphic="icon"
+        iconid="save"
         mwc-list-item=""
         tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/SaveProject.js"
       >
-        <mwc-icon slot="meta">
+        <mwc-icon slot="graphic">
           save
         </mwc-icon>
-        Save project
-      </mwc-check-list-item>
-      <li
-        divider=""
-        inset=""
-        role="separator"
-      >
-      </li>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/validators/ValidateSchema.js"
-      >
-        <mwc-icon slot="meta">
-          rule_folder
-        </mwc-icon>
-        Validate Schema
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/validators/ValidateTemplates.js"
-      >
-        <mwc-icon slot="meta">
-          rule_folder
-        </mwc-icon>
-        Validate Templates
-      </mwc-check-list-item>
-      <li
-        divider=""
-        inset=""
-        role="separator"
-      >
-      </li>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/ImportIEDs.js"
-      >
-        <mwc-icon slot="meta">
-          snippet_folder
-        </mwc-icon>
-        Import IEDs
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/VirtualTemplateIED.js"
-      >
-        <mwc-icon slot="meta">
-          developer_board
-        </mwc-icon>
-        Create Virtual IED
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/SubscriberInfo.js"
-      >
-        <mwc-icon slot="meta">
-          play_circle
-        </mwc-icon>
-        Subscriber Update
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/UpdateDescriptionABB.js"
-      >
-        <mwc-icon slot="meta">
-          play_circle
-        </mwc-icon>
-        Update desc (ABB)
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/UpdateDescriptionSEL.js"
-      >
-        <mwc-icon slot="meta">
-          play_circle
-        </mwc-icon>
-        Update desc (SEL)
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/Merge.js"
-      >
-        <mwc-icon slot="meta">
-          merge_type
-        </mwc-icon>
-        Merge Project
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/UpdateSubstation.js"
-      >
-        <mwc-icon slot="meta">
-          merge_type
-        </mwc-icon>
-        Update Substation
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/CompareIED.js"
-      >
-        <mwc-icon slot="meta">
-          compare_arrows
-        </mwc-icon>
-        Compare IED
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/ExportCommunication.js"
-      >
-        <mwc-icon slot="meta">
-          sim_card_download
-        </mwc-icon>
-        Export Communication Section
-      </mwc-check-list-item>
-      <li
-        divider=""
-        inset=""
-        role="separator"
-      >
-      </li>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/SclHistory.js"
-      >
-        <mwc-icon slot="meta">
-          history_toggle_off
-        </mwc-icon>
-        Show SCL History
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/Help.js"
-      >
-        <mwc-icon slot="meta">
-          help
-        </mwc-icon>
-        Help
-      </mwc-check-list-item>
-    </mwc-list>
-    <mwc-button
-      icon="refresh"
-      label="Reset"
-      slot="secondaryAction"
-      style="--mdc-theme-primary: var(--mdc-theme-error)"
-    >
-    </mwc-button>
-    <mwc-button
-      dialogaction="close"
-      icon=""
-      label="Close"
-      slot="secondaryAction"
-    >
-    </mwc-button>
-    <mwc-button
-      icon="library_add"
-      label="Add custom plug-in…"
-      outlined=""
-      slot="primaryAction"
-      trailingicon=""
-    >
-    </mwc-button>
-  </mwc-dialog>
-  <mwc-dialog
-    heading="Add custom plug-in"
-    id="pluginAdd"
-  >
-    <div style="display: flex; flex-direction: column; row-gap: 8px;">
-      <p style="color:var(--mdc-theme-error);">
-        Here you may add remote plug-ins directly from a custom URL.
-                You do this at your own risk.
-      </p>
-      <mwc-textfield
-        helper="Your preferred plug-in name"
-        id="pluginNameInput"
-        label="Name"
-        required=""
-      >
-      </mwc-textfield>
-      <mwc-list id="pluginKindList">
-        <mwc-radio-list-item
-          aria-disabled="false"
-          aria-selected="true"
-          graphic="control"
-          hasmeta=""
-          id="editor"
-          left=""
-          mwc-list-item=""
-          selected=""
-          tabindex="0"
-          value="editor"
-        >
-          Editor tab
-          <mwc-icon slot="meta">
-            tab
-          </mwc-icon>
-        </mwc-radio-list-item>
-        <mwc-radio-list-item
-          aria-disabled="false"
-          graphic="control"
-          hasmeta=""
-          left=""
-          mwc-list-item=""
-          tabindex="-1"
-          value="menu"
-        >
-          Menu entry
-          <mwc-icon slot="meta">
-            play_circle
-          </mwc-icon>
-        </mwc-radio-list-item>
-        <div id="menudetails">
-          <mwc-formfield
-            id="enabledefault"
-            label="Requires loaded document"
-          >
-            <mwc-switch
-              checked=""
-              id="requireDoc"
-            >
-            </mwc-switch>
-          </mwc-formfield>
-          <mwc-select
-            fixedmenuposition=""
-            id="menuPosition"
-            value="middle"
-          >
-            <mwc-list-item
-              aria-disabled="false"
-              mwc-list-item=""
-              role="option"
-              tabindex="-1"
-              value="top"
-            >
-              top
-            </mwc-list-item>
-            <mwc-list-item
-              aria-disabled="false"
-              mwc-list-item=""
-              role="option"
-              tabindex="-1"
-              value="middle"
-            >
-              middle
-            </mwc-list-item>
-            <mwc-list-item
-              aria-disabled="false"
-              mwc-list-item=""
-              role="option"
-              tabindex="-1"
-              value="bottom"
-            >
-              bottom
-            </mwc-list-item>
-          </mwc-select>
-        </div>
-        <mwc-radio-list-item
-          aria-disabled="false"
-          graphic="control"
-          hasmeta=""
-          id="validator"
-          left=""
-          mwc-list-item=""
-          tabindex="-1"
-          value="validator"
-        >
-          Validator
-          <mwc-icon slot="meta">
-            rule_folder
-          </mwc-icon>
-        </mwc-radio-list-item>
-      </mwc-list>
-      <mwc-textfield
-        helper="The vendor supplied plug-in URL"
-        id="pluginSrcInput"
-        label="URL"
-        placeholder="http://example.com/plugin.js"
-        required=""
-        type="url"
-      >
-      </mwc-textfield>
-    </div>
-    <mwc-button
-      dialogaction="close"
-      label="Cancel"
-      slot="secondaryAction"
-    >
-    </mwc-button>
-    <mwc-button
-      icon="add"
-      label="Add"
-      slot="primaryAction"
-      trailingicon=""
-    >
-    </mwc-button>
-  </mwc-dialog>
-</div>
-`;
-/* end snapshot open-scd renders menu plugins passed down as props and it looks like its snapshot */
-
-snapshots["open-scd renders editor plugins passed down as props and it looks like its snapshot"] = 
-`<div>
-  <slot>
-  </slot>
-  <mwc-top-app-bar-fixed>
-    <mwc-icon-button
-      icon="menu"
-      label="Menu"
-      slot="navigationIcon"
-    >
-    </mwc-icon-button>
-    <div
-      id="title"
-      slot="title"
-    >
-    </div>
-    <mwc-icon-button
-      disabled=""
-      icon="undo"
-      label="undo"
-      slot="actionItems"
-    >
-    </mwc-icon-button>
-    <mwc-icon-button
-      disabled=""
-      icon="redo"
-      label="redo"
-      slot="actionItems"
-    >
-    </mwc-icon-button>
-    <mwc-icon-button
-      icon="list"
-      label="menu.viewLog"
-      slot="actionItems"
-    >
-    </mwc-icon-button>
-    <mwc-icon-button
-      icon="history"
-      label="menu.viewHistory"
-      slot="actionItems"
-    >
-    </mwc-icon-button>
-    <mwc-icon-button
-      icon="rule"
-      label="menu.viewDiag"
-      slot="actionItems"
-    >
-    </mwc-icon-button>
-  </mwc-top-app-bar-fixed>
-  <mwc-drawer
-    class="mdc-theme--surface"
-    hasheader=""
-    id="menu"
-    type="modal"
-  >
-    <span slot="title">
-      Menu
-    </span>
-    <mwc-list wrapfocus="">
-      <li
-        divider=""
-        padded=""
-        role="separator"
-      >
-      </li>
-      <li
-        divider=""
-        padded=""
-        role="separator"
-      >
-      </li>
+        <span>
+          Save project
+        </span>
+      </mwc-list-item>
+      <oscd-pluginf3b6b19f30371924 class="menu plugin">
+      </oscd-pluginf3b6b19f30371924>
       <li
         divider=""
         padded=""
@@ -890,724 +144,254 @@ snapshots["open-scd renders editor plugins passed down as props and it looks lik
       >
       </li>
       <mwc-list-item
-        aria-disabled="false"
-        class="static"
-        data-name="settings.title"
+        aria-disabled="true"
+        class="validator"
+        data-name="Validate Schema"
+        disabled=""
         graphic="icon"
-        iconid="settings"
+        iconid="rule_folder"
         mwc-list-item=""
-        tabindex="0"
+        tabindex="-1"
       >
         <mwc-icon slot="graphic">
-          settings
+          rule_folder
         </mwc-icon>
         <span>
-          Settings
+          Validate Schema
         </span>
       </mwc-list-item>
+      <oscd-plugin8126aea23c207f03 class="plugin validator">
+      </oscd-plugin8126aea23c207f03>
       <mwc-list-item
-        aria-disabled="false"
-        class="static"
-        data-name="plugins.heading"
+        aria-disabled="true"
+        class="validator"
+        data-name="Validate Templates"
+        disabled=""
         graphic="icon"
-        iconid="extension"
+        iconid="rule_folder"
         mwc-list-item=""
         tabindex="-1"
       >
         <mwc-icon slot="graphic">
-          extension
+          rule_folder
         </mwc-icon>
         <span>
-          Plug-ins
+          Validate Templates
         </span>
       </mwc-list-item>
-    </mwc-list>
-  </mwc-drawer>
-  <div class="landing">
-  </div>
-  <mwc-dialog
-    heading="Plug-ins"
-    id="pluginManager"
-    stacked=""
-  >
-    <mwc-list
-      id="pluginList"
-      multi=""
-    >
-      <mwc-list-item
-        aria-disabled="false"
-        graphic="avatar"
-        noninteractive=""
-        tabindex="-1"
-      >
-        <strong>
-          Editor tab
-        </strong>
-        <mwc-icon
-          class="inverted"
-          slot="graphic"
-        >
-          tab
-        </mwc-icon>
-      </mwc-list-item>
+      <oscd-pluginb7f7ea2822da160b class="plugin validator">
+      </oscd-pluginb7f7ea2822da160b>
       <li
         divider=""
+        padded=""
         role="separator"
       >
-      </li>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="0"
-        value="http://localhost:8000/plugins/src/editors/IED.js"
-      >
-        <mwc-icon slot="meta">
-          developer_board
-        </mwc-icon>
-        IED
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/editors/Substation.js"
-      >
-        <mwc-icon slot="meta">
-          margin
-        </mwc-icon>
-        Substation
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/editors/SingleLineDiagram.js"
-      >
-        <mwc-icon slot="meta">
-          edit
-        </mwc-icon>
-        Single Line Diagram
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/editors/GooseSubscriberMessageBinding.js"
-      >
-        <mwc-icon slot="meta">
-          link
-        </mwc-icon>
-        Subscriber Message Binding (GOOSE)
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/editors/GooseSubscriberDataBinding.js"
-      >
-        <mwc-icon slot="meta">
-          link
-        </mwc-icon>
-        Subscriber Data Binding (GOOSE)
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/editors/GooseSubscriberLaterBinding.js"
-      >
-        <mwc-icon slot="meta">
-          link
-        </mwc-icon>
-        Subscriber Later Binding (GOOSE)
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/editors/SMVSubscriberMessageBinding.js"
-      >
-        <mwc-icon slot="meta">
-          link
-        </mwc-icon>
-        Subscriber Message Binding (SMV)
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/editors/SMVSubscriberDataBinding.js"
-      >
-        <mwc-icon slot="meta">
-          link
-        </mwc-icon>
-        Subscriber Data Binding (SMV)
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/editors/SMVSubscriberLaterBinding.js"
-      >
-        <mwc-icon slot="meta">
-          link
-        </mwc-icon>
-        Subscriber Later Binding (SMV)
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/editors/Communication.js"
-      >
-        <mwc-icon slot="meta">
-          settings_ethernet
-        </mwc-icon>
-        Communication
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/editors/Protocol104.js"
-      >
-        <mwc-icon slot="meta">
-          settings_ethernet
-        </mwc-icon>
-        104
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/editors/Templates.js"
-      >
-        <mwc-icon slot="meta">
-          copy_all
-        </mwc-icon>
-        Templates
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/editors/Publisher.js"
-      >
-        <mwc-icon slot="meta">
-          publish
-        </mwc-icon>
-        Publisher
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/editors/Cleanup.js"
-      >
-        <mwc-icon slot="meta">
-          cleaning_services
-        </mwc-icon>
-        Cleanup
-      </mwc-check-list-item>
-      <mwc-list-item
-        aria-disabled="false"
-        graphic="avatar"
-        noninteractive=""
-        tabindex="-1"
-      >
-        <strong>
-          Menu entry
-        </strong>
-        <mwc-icon
-          class="inverted"
-          slot="graphic"
-        >
-          <strong>
-            play_circle
-          </strong>
-        </mwc-icon>
-      </mwc-list-item>
-      <li
-        divider=""
-        role="separator"
-      >
-      </li>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/OpenProject.js"
-      >
-        <mwc-icon slot="meta">
-          folder_open
-        </mwc-icon>
-        Open project
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/NewProject.js"
-      >
-        <mwc-icon slot="meta">
-          create_new_folder
-        </mwc-icon>
-        New project
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/SaveProject.js"
-      >
-        <mwc-icon slot="meta">
-          save
-        </mwc-icon>
-        Save project
-      </mwc-check-list-item>
-      <li
-        divider=""
-        inset=""
-        role="separator"
-      >
-      </li>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/validators/ValidateSchema.js"
-      >
-        <mwc-icon slot="meta">
-          rule_folder
-        </mwc-icon>
-        Validate Schema
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/validators/ValidateTemplates.js"
-      >
-        <mwc-icon slot="meta">
-          rule_folder
-        </mwc-icon>
-        Validate Templates
-      </mwc-check-list-item>
-      <li
-        divider=""
-        inset=""
-        role="separator"
-      >
-      </li>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/ImportIEDs.js"
-      >
-        <mwc-icon slot="meta">
-          snippet_folder
-        </mwc-icon>
-        Import IEDs
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
+      </li>
+      <mwc-list-item
+        aria-disabled="true"
+        class="middle"
+        data-name="Import IEDs"
+        disabled=""
+        graphic="icon"
+        iconid="snippet_folder"
         mwc-list-item=""
         tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/VirtualTemplateIED.js"
       >
-        <mwc-icon slot="meta">
-          developer_board
+        <mwc-icon slot="graphic">
+          snippet_folder
         </mwc-icon>
-        Create Virtual IED
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
+        <span>
+          Import IEDs
+        </span>
+      </mwc-list-item>
+      <oscd-plugin164035de870e3ce2 class="menu plugin">
+      </oscd-plugin164035de870e3ce2>
+      <mwc-list-item
+        aria-disabled="true"
+        class="middle"
+        data-name="Subscriber Update"
+        disabled=""
+        graphic="icon"
+        iconid="play_circle"
         mwc-list-item=""
         tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/SubscriberInfo.js"
       >
-        <mwc-icon slot="meta">
+        <mwc-icon slot="graphic">
           play_circle
         </mwc-icon>
-        Subscriber Update
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
+        <span>
+          Subscriber Update
+        </span>
+      </mwc-list-item>
+      <oscd-plugin73c7200b70bd16a6 class="menu plugin">
+      </oscd-plugin73c7200b70bd16a6>
+      <mwc-list-item
+        aria-disabled="true"
+        class="middle"
+        data-name="Merge Project"
+        disabled=""
+        graphic="icon"
+        iconid="merge_type"
         mwc-list-item=""
         tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/UpdateDescriptionABB.js"
       >
-        <mwc-icon slot="meta">
-          play_circle
+        <mwc-icon slot="graphic">
+          merge_type
         </mwc-icon>
-        Update desc (ABB)
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
+        <span>
+          Merge Project
+        </span>
+      </mwc-list-item>
+      <oscd-plugin96a38f00c3583f5a class="menu plugin">
+      </oscd-plugin96a38f00c3583f5a>
+      <mwc-list-item
+        aria-disabled="true"
+        class="middle"
+        data-name="Update Substation"
+        disabled=""
+        graphic="icon"
+        iconid="merge_type"
         mwc-list-item=""
         tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/UpdateDescriptionSEL.js"
       >
-        <mwc-icon slot="meta">
-          play_circle
+        <mwc-icon slot="graphic">
+          merge_type
         </mwc-icon>
-        Update desc (SEL)
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
+        <span>
+          Update Substation
+        </span>
+      </mwc-list-item>
+      <oscd-plugind42cb104caa5b137 class="menu plugin">
+      </oscd-plugind42cb104caa5b137>
+      <mwc-list-item
+        aria-disabled="true"
+        class="middle"
+        data-name="Compare IED"
+        disabled=""
+        graphic="icon"
+        iconid="compare_arrows"
         mwc-list-item=""
         tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/Merge.js"
       >
-        <mwc-icon slot="meta">
-          merge_type
+        <mwc-icon slot="graphic">
+          compare_arrows
         </mwc-icon>
-        Merge Project
-      </mwc-check-list-item>
-      <mwc-check-list-item
+        <span>
+          Compare IED
+        </span>
+      </mwc-list-item>
+      <oscd-plugin531256cb341ab97e class="menu plugin">
+      </oscd-plugin531256cb341ab97e>
+      <li
+        divider=""
+        padded=""
+        role="separator"
+      >
+      </li>
+      <mwc-list-item
         aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
+        class="static"
+        data-name="settings.title"
+        graphic="icon"
+        iconid="settings"
         mwc-list-item=""
         tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/UpdateSubstation.js"
       >
-        <mwc-icon slot="meta">
-          merge_type
+        <mwc-icon slot="graphic">
+          settings
         </mwc-icon>
-        Update Substation
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
+        <span>
+          Settings
+        </span>
+      </mwc-list-item>
+      <mwc-list-item
+        aria-disabled="true"
+        class="bottom"
+        data-name="Show SCL History"
+        disabled=""
+        graphic="icon"
+        iconid="history_toggle_off"
         mwc-list-item=""
         tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/CompareIED.js"
       >
-        <mwc-icon slot="meta">
-          compare_arrows
+        <mwc-icon slot="graphic">
+          history_toggle_off
         </mwc-icon>
-        Compare IED
-      </mwc-check-list-item>
-      <mwc-check-list-item
+        <span>
+          Show SCL History
+        </span>
+      </mwc-list-item>
+      <oscd-plugin70e8eaeb84bf47f6 class="menu plugin">
+      </oscd-plugin70e8eaeb84bf47f6>
+      <mwc-list-item
         aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
+        class="bottom"
+        data-name="Help"
+        graphic="icon"
+        iconid="help"
         mwc-list-item=""
         tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/ExportCommunication.js"
       >
-        <mwc-icon slot="meta">
-          sim_card_download
+        <mwc-icon slot="graphic">
+          help
         </mwc-icon>
-        Export Communication Section
-      </mwc-check-list-item>
+        <span>
+          Help
+        </span>
+      </mwc-list-item>
+      <oscd-plugin6589bc97026c833d class="menu plugin">
+      </oscd-plugin6589bc97026c833d>
       <li
         divider=""
-        inset=""
+        padded=""
         role="separator"
       >
       </li>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/SclHistory.js"
-      >
-        <mwc-icon slot="meta">
-          history_toggle_off
-        </mwc-icon>
-        Show SCL History
-      </mwc-check-list-item>
-      <mwc-check-list-item
+      <mwc-list-item
         aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
+        class="static"
+        data-name="plugins.heading"
+        graphic="icon"
+        iconid="extension"
         mwc-list-item=""
         tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/Help.js"
       >
-        <mwc-icon slot="meta">
-          help
+        <mwc-icon slot="graphic">
+          extension
         </mwc-icon>
-        Help
-      </mwc-check-list-item>
+        <span>
+          Plug-ins
+        </span>
+      </mwc-list-item>
     </mwc-list>
-    <mwc-button
-      icon="refresh"
-      label="Reset"
-      slot="secondaryAction"
-      style="--mdc-theme-primary: var(--mdc-theme-error)"
-    >
-    </mwc-button>
-    <mwc-button
-      dialogaction="close"
-      icon=""
-      label="Close"
-      slot="secondaryAction"
-    >
-    </mwc-button>
-    <mwc-button
-      icon="library_add"
-      label="Add custom plug-in…"
-      outlined=""
-      slot="primaryAction"
-      trailingicon=""
-    >
-    </mwc-button>
-  </mwc-dialog>
-  <mwc-dialog
-    heading="Add custom plug-in"
-    id="pluginAdd"
-  >
-    <div style="display: flex; flex-direction: column; row-gap: 8px;">
-      <p style="color:var(--mdc-theme-error);">
-        Here you may add remote plug-ins directly from a custom URL.
-                You do this at your own risk.
-      </p>
-      <mwc-textfield
-        helper="Your preferred plug-in name"
-        id="pluginNameInput"
-        label="Name"
-        required=""
-      >
-      </mwc-textfield>
-      <mwc-list id="pluginKindList">
-        <mwc-radio-list-item
-          aria-disabled="false"
-          aria-selected="true"
-          graphic="control"
-          hasmeta=""
-          id="editor"
-          left=""
-          mwc-list-item=""
-          selected=""
-          tabindex="0"
-          value="editor"
-        >
-          Editor tab
-          <mwc-icon slot="meta">
-            tab
-          </mwc-icon>
-        </mwc-radio-list-item>
-        <mwc-radio-list-item
-          aria-disabled="false"
-          graphic="control"
-          hasmeta=""
-          left=""
-          mwc-list-item=""
-          tabindex="-1"
-          value="menu"
-        >
-          Menu entry
-          <mwc-icon slot="meta">
-            play_circle
-          </mwc-icon>
-        </mwc-radio-list-item>
-        <div id="menudetails">
-          <mwc-formfield
-            id="enabledefault"
-            label="Requires loaded document"
-          >
-            <mwc-switch
-              checked=""
-              id="requireDoc"
-            >
-            </mwc-switch>
-          </mwc-formfield>
-          <mwc-select
-            fixedmenuposition=""
-            id="menuPosition"
-            value="middle"
-          >
-            <mwc-list-item
-              aria-disabled="false"
-              mwc-list-item=""
-              role="option"
-              tabindex="-1"
-              value="top"
-            >
-              top
-            </mwc-list-item>
-            <mwc-list-item
-              aria-disabled="false"
-              mwc-list-item=""
-              role="option"
-              tabindex="-1"
-              value="middle"
-            >
-              middle
-            </mwc-list-item>
-            <mwc-list-item
-              aria-disabled="false"
-              mwc-list-item=""
-              role="option"
-              tabindex="-1"
-              value="bottom"
-            >
-              bottom
-            </mwc-list-item>
-          </mwc-select>
-        </div>
-        <mwc-radio-list-item
-          aria-disabled="false"
-          graphic="control"
-          hasmeta=""
-          id="validator"
-          left=""
-          mwc-list-item=""
-          tabindex="-1"
-          value="validator"
-        >
-          Validator
-          <mwc-icon slot="meta">
-            rule_folder
-          </mwc-icon>
-        </mwc-radio-list-item>
-      </mwc-list>
-      <mwc-textfield
-        helper="The vendor supplied plug-in URL"
-        id="pluginSrcInput"
-        label="URL"
-        placeholder="http://example.com/plugin.js"
-        required=""
-        type="url"
-      >
-      </mwc-textfield>
-    </div>
-    <mwc-button
-      dialogaction="close"
-      label="Cancel"
-      slot="secondaryAction"
+  </mwc-drawer>
+  <div class="landing">
+    <mwc-icon-button
+      class="landing_icon"
+      icon="folder_open"
     >
-    </mwc-button>
-    <mwc-button
-      icon="add"
-      label="Add"
-      slot="primaryAction"
-      trailingicon=""
+      <div class="landing_label">
+        Open project
+      </div>
+    </mwc-icon-button>
+    <mwc-icon-button
+      class="landing_icon"
+      icon="create_new_folder"
     >
-    </mwc-button>
-  </mwc-dialog>
+      <div class="landing_label">
+        New project
+      </div>
+    </mwc-icon-button>
+  </div>
+  <oscd-plugin-manager id="pluginManager">
+  </oscd-plugin-manager>
+  <oscd-custom-plugin-dialog id="pluginAdd">
+  </oscd-custom-plugin-dialog>
 </div>
 `;
-/* end snapshot open-scd renders editor plugins passed down as props and it looks like its snapshot */
+/* end snapshot open-scd renders menu plugins passed down as props and it looks like its snapshot */
 
-snapshots["open-scd layout looks like its snapshot"] = 
+snapshots["open-scd renders editor plugins passed down as props and it looks like its snapshot"] = 
 `<div>
   <slot>
   </slot>
@@ -1666,18 +450,6 @@ snapshots["open-scd layout looks like its snapshot"] =
       Menu
     </span>
     <mwc-list wrapfocus="">
-      <li
-        divider=""
-        padded=""
-        role="separator"
-      >
-      </li>
-      <li
-        divider=""
-        padded=""
-        role="separator"
-      >
-      </li>
       <li
         divider=""
         padded=""
@@ -1686,721 +458,683 @@ snapshots["open-scd layout looks like its snapshot"] =
       </li>
       <mwc-list-item
         aria-disabled="false"
-        class="static"
-        data-name="settings.title"
+        class="top"
+        data-name="Open project"
         graphic="icon"
-        iconid="settings"
+        iconid="folder_open"
         mwc-list-item=""
         tabindex="0"
       >
         <mwc-icon slot="graphic">
-          settings
+          folder_open
         </mwc-icon>
         <span>
-          Settings
+          Open project
         </span>
       </mwc-list-item>
+      <oscd-plugind0b9863131b4146e class="menu plugin">
+      </oscd-plugind0b9863131b4146e>
       <mwc-list-item
         aria-disabled="false"
-        class="static"
-        data-name="plugins.heading"
+        class="top"
+        data-name="New project"
         graphic="icon"
-        iconid="extension"
+        iconid="create_new_folder"
         mwc-list-item=""
         tabindex="-1"
       >
         <mwc-icon slot="graphic">
-          extension
+          create_new_folder
         </mwc-icon>
         <span>
-          Plug-ins
+          New project
         </span>
       </mwc-list-item>
-    </mwc-list>
-  </mwc-drawer>
-  <div class="landing">
-  </div>
-  <mwc-dialog
-    heading="Plug-ins"
-    id="pluginManager"
-    stacked=""
-  >
-    <mwc-list
-      id="pluginList"
-      multi=""
-    >
+      <oscd-plugin9b4f3043bce10a59 class="menu plugin">
+      </oscd-plugin9b4f3043bce10a59>
       <mwc-list-item
-        aria-disabled="false"
-        graphic="avatar"
-        noninteractive=""
+        aria-disabled="true"
+        class="top"
+        data-name="Save project"
+        disabled=""
+        graphic="icon"
+        iconid="save"
+        mwc-list-item=""
         tabindex="-1"
       >
-        <strong>
-          Editor tab
-        </strong>
-        <mwc-icon
-          class="inverted"
-          slot="graphic"
-        >
-          tab
+        <mwc-icon slot="graphic">
+          save
         </mwc-icon>
+        <span>
+          Save project
+        </span>
       </mwc-list-item>
+      <oscd-pluginf3b6b19f30371924 class="menu plugin">
+      </oscd-pluginf3b6b19f30371924>
       <li
         divider=""
+        padded=""
         role="separator"
       >
       </li>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="0"
-        value="http://localhost:8000/plugins/src/editors/IED.js"
-      >
-        <mwc-icon slot="meta">
-          developer_board
-        </mwc-icon>
-        IED
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/editors/Substation.js"
-      >
-        <mwc-icon slot="meta">
-          margin
-        </mwc-icon>
-        Substation
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
+      <mwc-list-item
+        aria-disabled="true"
+        class="validator"
+        data-name="Validate Schema"
+        disabled=""
+        graphic="icon"
+        iconid="rule_folder"
         mwc-list-item=""
         tabindex="-1"
-        value="http://localhost:8000/plugins/src/editors/SingleLineDiagram.js"
       >
-        <mwc-icon slot="meta">
-          edit
+        <mwc-icon slot="graphic">
+          rule_folder
         </mwc-icon>
-        Single Line Diagram
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
+        <span>
+          Validate Schema
+        </span>
+      </mwc-list-item>
+      <oscd-plugin8126aea23c207f03 class="plugin validator">
+      </oscd-plugin8126aea23c207f03>
+      <mwc-list-item
+        aria-disabled="true"
+        class="validator"
+        data-name="Validate Templates"
+        disabled=""
+        graphic="icon"
+        iconid="rule_folder"
         mwc-list-item=""
         tabindex="-1"
-        value="http://localhost:8000/plugins/src/editors/GooseSubscriberMessageBinding.js"
       >
-        <mwc-icon slot="meta">
-          link
+        <mwc-icon slot="graphic">
+          rule_folder
         </mwc-icon>
-        Subscriber Message Binding (GOOSE)
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/editors/GooseSubscriberDataBinding.js"
+        <span>
+          Validate Templates
+        </span>
+      </mwc-list-item>
+      <oscd-pluginb7f7ea2822da160b class="plugin validator">
+      </oscd-pluginb7f7ea2822da160b>
+      <li
+        divider=""
+        padded=""
+        role="separator"
       >
-        <mwc-icon slot="meta">
-          link
-        </mwc-icon>
-        Subscriber Data Binding (GOOSE)
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
+      </li>
+      <mwc-list-item
+        aria-disabled="true"
+        class="middle"
+        data-name="Import IEDs"
+        disabled=""
+        graphic="icon"
+        iconid="snippet_folder"
         mwc-list-item=""
         tabindex="-1"
-        value="http://localhost:8000/plugins/src/editors/GooseSubscriberLaterBinding.js"
       >
-        <mwc-icon slot="meta">
-          link
+        <mwc-icon slot="graphic">
+          snippet_folder
         </mwc-icon>
-        Subscriber Later Binding (GOOSE)
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
+        <span>
+          Import IEDs
+        </span>
+      </mwc-list-item>
+      <oscd-plugin164035de870e3ce2 class="menu plugin">
+      </oscd-plugin164035de870e3ce2>
+      <mwc-list-item
+        aria-disabled="true"
+        class="middle"
+        data-name="Subscriber Update"
+        disabled=""
+        graphic="icon"
+        iconid="play_circle"
         mwc-list-item=""
         tabindex="-1"
-        value="http://localhost:8000/plugins/src/editors/SMVSubscriberMessageBinding.js"
       >
-        <mwc-icon slot="meta">
-          link
+        <mwc-icon slot="graphic">
+          play_circle
         </mwc-icon>
-        Subscriber Message Binding (SMV)
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
+        <span>
+          Subscriber Update
+        </span>
+      </mwc-list-item>
+      <oscd-plugin73c7200b70bd16a6 class="menu plugin">
+      </oscd-plugin73c7200b70bd16a6>
+      <mwc-list-item
+        aria-disabled="true"
+        class="middle"
+        data-name="Merge Project"
+        disabled=""
+        graphic="icon"
+        iconid="merge_type"
         mwc-list-item=""
         tabindex="-1"
-        value="http://localhost:8000/plugins/src/editors/SMVSubscriberDataBinding.js"
       >
-        <mwc-icon slot="meta">
-          link
+        <mwc-icon slot="graphic">
+          merge_type
         </mwc-icon>
-        Subscriber Data Binding (SMV)
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
+        <span>
+          Merge Project
+        </span>
+      </mwc-list-item>
+      <oscd-plugin96a38f00c3583f5a class="menu plugin">
+      </oscd-plugin96a38f00c3583f5a>
+      <mwc-list-item
+        aria-disabled="true"
+        class="middle"
+        data-name="Update Substation"
+        disabled=""
+        graphic="icon"
+        iconid="merge_type"
         mwc-list-item=""
         tabindex="-1"
-        value="http://localhost:8000/plugins/src/editors/SMVSubscriberLaterBinding.js"
       >
-        <mwc-icon slot="meta">
-          link
+        <mwc-icon slot="graphic">
+          merge_type
         </mwc-icon>
-        Subscriber Later Binding (SMV)
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
+        <span>
+          Update Substation
+        </span>
+      </mwc-list-item>
+      <oscd-plugind42cb104caa5b137 class="menu plugin">
+      </oscd-plugind42cb104caa5b137>
+      <mwc-list-item
+        aria-disabled="true"
+        class="middle"
+        data-name="Compare IED"
+        disabled=""
+        graphic="icon"
+        iconid="compare_arrows"
         mwc-list-item=""
         tabindex="-1"
-        value="http://localhost:8000/plugins/src/editors/Communication.js"
       >
-        <mwc-icon slot="meta">
-          settings_ethernet
+        <mwc-icon slot="graphic">
+          compare_arrows
         </mwc-icon>
-        Communication
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/editors/Protocol104.js"
+        <span>
+          Compare IED
+        </span>
+      </mwc-list-item>
+      <oscd-plugin531256cb341ab97e class="menu plugin">
+      </oscd-plugin531256cb341ab97e>
+      <li
+        divider=""
+        padded=""
+        role="separator"
       >
-        <mwc-icon slot="meta">
-          settings_ethernet
-        </mwc-icon>
-        104
-      </mwc-check-list-item>
-      <mwc-check-list-item
+      </li>
+      <mwc-list-item
         aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
+        class="static"
+        data-name="settings.title"
+        graphic="icon"
+        iconid="settings"
         mwc-list-item=""
         tabindex="-1"
-        value="http://localhost:8000/plugins/src/editors/Templates.js"
       >
-        <mwc-icon slot="meta">
-          copy_all
+        <mwc-icon slot="graphic">
+          settings
         </mwc-icon>
-        Templates
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
+        <span>
+          Settings
+        </span>
+      </mwc-list-item>
+      <mwc-list-item
+        aria-disabled="true"
+        class="bottom"
+        data-name="Show SCL History"
+        disabled=""
+        graphic="icon"
+        iconid="history_toggle_off"
         mwc-list-item=""
         tabindex="-1"
-        value="http://localhost:8000/plugins/src/editors/Publisher.js"
       >
-        <mwc-icon slot="meta">
-          publish
+        <mwc-icon slot="graphic">
+          history_toggle_off
         </mwc-icon>
-        Publisher
-      </mwc-check-list-item>
-      <mwc-check-list-item
+        <span>
+          Show SCL History
+        </span>
+      </mwc-list-item>
+      <oscd-plugin70e8eaeb84bf47f6 class="menu plugin">
+      </oscd-plugin70e8eaeb84bf47f6>
+      <mwc-list-item
         aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
+        class="bottom"
+        data-name="Help"
+        graphic="icon"
+        iconid="help"
         mwc-list-item=""
         tabindex="-1"
-        value="http://localhost:8000/plugins/src/editors/Cleanup.js"
       >
-        <mwc-icon slot="meta">
-          cleaning_services
+        <mwc-icon slot="graphic">
+          help
         </mwc-icon>
-        Cleanup
-      </mwc-check-list-item>
+        <span>
+          Help
+        </span>
+      </mwc-list-item>
+      <oscd-plugin6589bc97026c833d class="menu plugin">
+      </oscd-plugin6589bc97026c833d>
+      <li
+        divider=""
+        padded=""
+        role="separator"
+      >
+      </li>
       <mwc-list-item
         aria-disabled="false"
-        graphic="avatar"
-        noninteractive=""
+        class="static"
+        data-name="plugins.heading"
+        graphic="icon"
+        iconid="extension"
+        mwc-list-item=""
         tabindex="-1"
       >
-        <strong>
-          Menu entry
-        </strong>
-        <mwc-icon
-          class="inverted"
-          slot="graphic"
-        >
-          <strong>
-            play_circle
-          </strong>
+        <mwc-icon slot="graphic">
+          extension
         </mwc-icon>
+        <span>
+          Plug-ins
+        </span>
       </mwc-list-item>
+    </mwc-list>
+  </mwc-drawer>
+  <div class="landing">
+    <mwc-icon-button
+      class="landing_icon"
+      icon="folder_open"
+    >
+      <div class="landing_label">
+        Open project
+      </div>
+    </mwc-icon-button>
+    <mwc-icon-button
+      class="landing_icon"
+      icon="create_new_folder"
+    >
+      <div class="landing_label">
+        New project
+      </div>
+    </mwc-icon-button>
+  </div>
+  <oscd-plugin-manager id="pluginManager">
+  </oscd-plugin-manager>
+  <oscd-custom-plugin-dialog id="pluginAdd">
+  </oscd-custom-plugin-dialog>
+</div>
+`;
+/* end snapshot open-scd renders editor plugins passed down as props and it looks like its snapshot */
+
+snapshots["open-scd layout looks like its snapshot"] = 
+`<div>
+  <slot>
+  </slot>
+  <mwc-top-app-bar-fixed>
+    <mwc-icon-button
+      icon="menu"
+      label="Menu"
+      slot="navigationIcon"
+    >
+    </mwc-icon-button>
+    <div
+      id="title"
+      slot="title"
+    >
+    </div>
+    <mwc-icon-button
+      disabled=""
+      icon="undo"
+      label="undo"
+      slot="actionItems"
+    >
+    </mwc-icon-button>
+    <mwc-icon-button
+      disabled=""
+      icon="redo"
+      label="redo"
+      slot="actionItems"
+    >
+    </mwc-icon-button>
+    <mwc-icon-button
+      icon="list"
+      label="menu.viewLog"
+      slot="actionItems"
+    >
+    </mwc-icon-button>
+    <mwc-icon-button
+      icon="history"
+      label="menu.viewHistory"
+      slot="actionItems"
+    >
+    </mwc-icon-button>
+    <mwc-icon-button
+      icon="rule"
+      label="menu.viewDiag"
+      slot="actionItems"
+    >
+    </mwc-icon-button>
+  </mwc-top-app-bar-fixed>
+  <mwc-drawer
+    class="mdc-theme--surface"
+    hasheader=""
+    id="menu"
+    type="modal"
+  >
+    <span slot="title">
+      Menu
+    </span>
+    <mwc-list wrapfocus="">
       <li
         divider=""
+        padded=""
         role="separator"
       >
       </li>
-      <mwc-check-list-item
+      <mwc-list-item
         aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
+        class="top"
+        data-name="Open project"
+        graphic="icon"
+        iconid="folder_open"
         mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/OpenProject.js"
+        tabindex="0"
       >
-        <mwc-icon slot="meta">
+        <mwc-icon slot="graphic">
           folder_open
         </mwc-icon>
-        Open project
-      </mwc-check-list-item>
-      <mwc-check-list-item
+        <span>
+          Open project
+        </span>
+      </mwc-list-item>
+      <oscd-plugind0b9863131b4146e class="menu plugin">
+      </oscd-plugind0b9863131b4146e>
+      <mwc-list-item
         aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
+        class="top"
+        data-name="New project"
+        graphic="icon"
+        iconid="create_new_folder"
         mwc-list-item=""
         tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/NewProject.js"
       >
-        <mwc-icon slot="meta">
+        <mwc-icon slot="graphic">
           create_new_folder
         </mwc-icon>
-        New project
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
+        <span>
+          New project
+        </span>
+      </mwc-list-item>
+      <oscd-plugin9b4f3043bce10a59 class="menu plugin">
+      </oscd-plugin9b4f3043bce10a59>
+      <mwc-list-item
+        aria-disabled="true"
+        class="top"
+        data-name="Save project"
+        disabled=""
+        graphic="icon"
+        iconid="save"
         mwc-list-item=""
         tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/SaveProject.js"
       >
-        <mwc-icon slot="meta">
+        <mwc-icon slot="graphic">
           save
         </mwc-icon>
-        Save project
-      </mwc-check-list-item>
+        <span>
+          Save project
+        </span>
+      </mwc-list-item>
+      <oscd-pluginf3b6b19f30371924 class="menu plugin">
+      </oscd-pluginf3b6b19f30371924>
       <li
         divider=""
-        inset=""
+        padded=""
         role="separator"
       >
       </li>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
+      <mwc-list-item
+        aria-disabled="true"
+        class="validator"
+        data-name="Validate Schema"
+        disabled=""
+        graphic="icon"
+        iconid="rule_folder"
         mwc-list-item=""
         tabindex="-1"
-        value="http://localhost:8000/plugins/src/validators/ValidateSchema.js"
       >
-        <mwc-icon slot="meta">
+        <mwc-icon slot="graphic">
           rule_folder
         </mwc-icon>
-        Validate Schema
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
+        <span>
+          Validate Schema
+        </span>
+      </mwc-list-item>
+      <oscd-plugin8126aea23c207f03 class="plugin validator">
+      </oscd-plugin8126aea23c207f03>
+      <mwc-list-item
+        aria-disabled="true"
+        class="validator"
+        data-name="Validate Templates"
+        disabled=""
+        graphic="icon"
+        iconid="rule_folder"
         mwc-list-item=""
         tabindex="-1"
-        value="http://localhost:8000/plugins/src/validators/ValidateTemplates.js"
       >
-        <mwc-icon slot="meta">
+        <mwc-icon slot="graphic">
           rule_folder
         </mwc-icon>
-        Validate Templates
-      </mwc-check-list-item>
+        <span>
+          Validate Templates
+        </span>
+      </mwc-list-item>
+      <oscd-pluginb7f7ea2822da160b class="plugin validator">
+      </oscd-pluginb7f7ea2822da160b>
       <li
         divider=""
-        inset=""
+        padded=""
         role="separator"
       >
       </li>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
+      <mwc-list-item
+        aria-disabled="true"
+        class="middle"
+        data-name="Import IEDs"
+        disabled=""
+        graphic="icon"
+        iconid="snippet_folder"
         mwc-list-item=""
         tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/ImportIEDs.js"
       >
-        <mwc-icon slot="meta">
+        <mwc-icon slot="graphic">
           snippet_folder
         </mwc-icon>
-        Import IEDs
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/VirtualTemplateIED.js"
-      >
-        <mwc-icon slot="meta">
-          developer_board
-        </mwc-icon>
-        Create Virtual IED
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
+        <span>
+          Import IEDs
+        </span>
+      </mwc-list-item>
+      <oscd-plugin164035de870e3ce2 class="menu plugin">
+      </oscd-plugin164035de870e3ce2>
+      <mwc-list-item
+        aria-disabled="true"
+        class="middle"
+        data-name="Subscriber Update"
+        disabled=""
+        graphic="icon"
+        iconid="play_circle"
         mwc-list-item=""
         tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/SubscriberInfo.js"
       >
-        <mwc-icon slot="meta">
+        <mwc-icon slot="graphic">
           play_circle
         </mwc-icon>
-        Subscriber Update
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
+        <span>
+          Subscriber Update
+        </span>
+      </mwc-list-item>
+      <oscd-plugin73c7200b70bd16a6 class="menu plugin">
+      </oscd-plugin73c7200b70bd16a6>
+      <mwc-list-item
+        aria-disabled="true"
+        class="middle"
+        data-name="Merge Project"
+        disabled=""
+        graphic="icon"
+        iconid="merge_type"
         mwc-list-item=""
         tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/UpdateDescriptionABB.js"
       >
-        <mwc-icon slot="meta">
-          play_circle
+        <mwc-icon slot="graphic">
+          merge_type
         </mwc-icon>
-        Update desc (ABB)
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
+        <span>
+          Merge Project
+        </span>
+      </mwc-list-item>
+      <oscd-plugin96a38f00c3583f5a class="menu plugin">
+      </oscd-plugin96a38f00c3583f5a>
+      <mwc-list-item
+        aria-disabled="true"
+        class="middle"
+        data-name="Update Substation"
+        disabled=""
+        graphic="icon"
+        iconid="merge_type"
         mwc-list-item=""
         tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/UpdateDescriptionSEL.js"
       >
-        <mwc-icon slot="meta">
-          play_circle
+        <mwc-icon slot="graphic">
+          merge_type
         </mwc-icon>
-        Update desc (SEL)
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
+        <span>
+          Update Substation
+        </span>
+      </mwc-list-item>
+      <oscd-plugind42cb104caa5b137 class="menu plugin">
+      </oscd-plugind42cb104caa5b137>
+      <mwc-list-item
+        aria-disabled="true"
+        class="middle"
+        data-name="Compare IED"
+        disabled=""
+        graphic="icon"
+        iconid="compare_arrows"
         mwc-list-item=""
         tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/Merge.js"
       >
-        <mwc-icon slot="meta">
-          merge_type
+        <mwc-icon slot="graphic">
+          compare_arrows
         </mwc-icon>
-        Merge Project
-      </mwc-check-list-item>
-      <mwc-check-list-item
+        <span>
+          Compare IED
+        </span>
+      </mwc-list-item>
+      <oscd-plugin531256cb341ab97e class="menu plugin">
+      </oscd-plugin531256cb341ab97e>
+      <li
+        divider=""
+        padded=""
+        role="separator"
+      >
+      </li>
+      <mwc-list-item
         aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
+        class="static"
+        data-name="settings.title"
+        graphic="icon"
+        iconid="settings"
         mwc-list-item=""
         tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/UpdateSubstation.js"
       >
-        <mwc-icon slot="meta">
-          merge_type
+        <mwc-icon slot="graphic">
+          settings
         </mwc-icon>
-        Update Substation
-      </mwc-check-list-item>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
+        <span>
+          Settings
+        </span>
+      </mwc-list-item>
+      <mwc-list-item
+        aria-disabled="true"
+        class="bottom"
+        data-name="Show SCL History"
+        disabled=""
+        graphic="icon"
+        iconid="history_toggle_off"
         mwc-list-item=""
         tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/CompareIED.js"
       >
-        <mwc-icon slot="meta">
-          compare_arrows
+        <mwc-icon slot="graphic">
+          history_toggle_off
         </mwc-icon>
-        Compare IED
-      </mwc-check-list-item>
-      <mwc-check-list-item
+        <span>
+          Show SCL History
+        </span>
+      </mwc-list-item>
+      <oscd-plugin70e8eaeb84bf47f6 class="menu plugin">
+      </oscd-plugin70e8eaeb84bf47f6>
+      <mwc-list-item
         aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
+        class="bottom"
+        data-name="Help"
+        graphic="icon"
+        iconid="help"
         mwc-list-item=""
         tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/ExportCommunication.js"
       >
-        <mwc-icon slot="meta">
-          sim_card_download
+        <mwc-icon slot="graphic">
+          help
         </mwc-icon>
-        Export Communication Section
-      </mwc-check-list-item>
+        <span>
+          Help
+        </span>
+      </mwc-list-item>
+      <oscd-plugin6589bc97026c833d class="menu plugin">
+      </oscd-plugin6589bc97026c833d>
       <li
         divider=""
-        inset=""
+        padded=""
         role="separator"
       >
       </li>
-      <mwc-check-list-item
-        aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
-        mwc-list-item=""
-        tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/SclHistory.js"
-      >
-        <mwc-icon slot="meta">
-          history_toggle_off
-        </mwc-icon>
-        Show SCL History
-      </mwc-check-list-item>
-      <mwc-check-list-item
+      <mwc-list-item
         aria-disabled="false"
-        class="external"
-        graphic="control"
-        hasmeta=""
-        left=""
+        class="static"
+        data-name="plugins.heading"
+        graphic="icon"
+        iconid="extension"
         mwc-list-item=""
         tabindex="-1"
-        value="http://localhost:8000/plugins/src/menu/Help.js"
       >
-        <mwc-icon slot="meta">
-          help
+        <mwc-icon slot="graphic">
+          extension
         </mwc-icon>
-        Help
-      </mwc-check-list-item>
+        <span>
+          Plug-ins
+        </span>
+      </mwc-list-item>
     </mwc-list>
-    <mwc-button
-      icon="refresh"
-      label="Reset"
-      slot="secondaryAction"
-      style="--mdc-theme-primary: var(--mdc-theme-error)"
-    >
-    </mwc-button>
-    <mwc-button
-      dialogaction="close"
-      icon=""
-      label="Close"
-      slot="secondaryAction"
-    >
-    </mwc-button>
-    <mwc-button
-      icon="library_add"
-      label="Add custom plug-in…"
-      outlined=""
-      slot="primaryAction"
-      trailingicon=""
-    >
-    </mwc-button>
-  </mwc-dialog>
-  <mwc-dialog
-    heading="Add custom plug-in"
-    id="pluginAdd"
-  >
-    <div style="display: flex; flex-direction: column; row-gap: 8px;">
-      <p style="color:var(--mdc-theme-error);">
-        Here you may add remote plug-ins directly from a custom URL.
-                You do this at your own risk.
-      </p>
-      <mwc-textfield
-        helper="Your preferred plug-in name"
-        id="pluginNameInput"
-        label="Name"
-        required=""
-      >
-      </mwc-textfield>
-      <mwc-list id="pluginKindList">
-        <mwc-radio-list-item
-          aria-disabled="false"
-          aria-selected="true"
-          graphic="control"
-          hasmeta=""
-          id="editor"
-          left=""
-          mwc-list-item=""
-          selected=""
-          tabindex="0"
-          value="editor"
-        >
-          Editor tab
-          <mwc-icon slot="meta">
-            tab
-          </mwc-icon>
-        </mwc-radio-list-item>
-        <mwc-radio-list-item
-          aria-disabled="false"
-          graphic="control"
-          hasmeta=""
-          left=""
-          mwc-list-item=""
-          tabindex="-1"
-          value="menu"
-        >
-          Menu entry
-          <mwc-icon slot="meta">
-            play_circle
-          </mwc-icon>
-        </mwc-radio-list-item>
-        <div id="menudetails">
-          <mwc-formfield
-            id="enabledefault"
-            label="Requires loaded document"
-          >
-            <mwc-switch
-              checked=""
-              id="requireDoc"
-            >
-            </mwc-switch>
-          </mwc-formfield>
-          <mwc-select
-            fixedmenuposition=""
-            id="menuPosition"
-            value="middle"
-          >
-            <mwc-list-item
-              aria-disabled="false"
-              mwc-list-item=""
-              role="option"
-              tabindex="-1"
-              value="top"
-            >
-              top
-            </mwc-list-item>
-            <mwc-list-item
-              activated=""
-              aria-disabled="false"
-              aria-selected="true"
-              mwc-list-item=""
-              role="option"
-              selected=""
-              tabindex="0"
-              value="middle"
-            >
-              middle
-            </mwc-list-item>
-            <mwc-list-item
-              aria-disabled="false"
-              mwc-list-item=""
-              role="option"
-              tabindex="-1"
-              value="bottom"
-            >
-              bottom
-            </mwc-list-item>
-          </mwc-select>
-        </div>
-        <mwc-radio-list-item
-          aria-disabled="false"
-          graphic="control"
-          hasmeta=""
-          id="validator"
-          left=""
-          mwc-list-item=""
-          tabindex="-1"
-          value="validator"
-        >
-          Validator
-          <mwc-icon slot="meta">
-            rule_folder
-          </mwc-icon>
-        </mwc-radio-list-item>
-      </mwc-list>
-      <mwc-textfield
-        helper="The vendor supplied plug-in URL"
-        id="pluginSrcInput"
-        label="URL"
-        placeholder="http://example.com/plugin.js"
-        required=""
-        type="url"
-      >
-      </mwc-textfield>
-    </div>
-    <mwc-button
-      dialogaction="close"
-      label="Cancel"
-      slot="secondaryAction"
+  </mwc-drawer>
+  <div class="landing">
+    <mwc-icon-button
+      class="landing_icon"
+      icon="folder_open"
     >
-    </mwc-button>
-    <mwc-button
-      icon="add"
-      label="Add"
-      slot="primaryAction"
-      trailingicon=""
+      <div class="landing_label">
+        Open project
+      </div>
+    </mwc-icon-button>
+    <mwc-icon-button
+      class="landing_icon"
+      icon="create_new_folder"
     >
-    </mwc-button>
-  </mwc-dialog>
+      <div class="landing_label">
+        New project
+      </div>
+    </mwc-icon-button>
+  </div>
+  <oscd-plugin-manager id="pluginManager">
+  </oscd-plugin-manager>
+  <oscd-custom-plugin-dialog id="pluginAdd">
+  </oscd-custom-plugin-dialog>
 </div>
 `;
 /* end snapshot open-scd layout looks like its snapshot */
diff --git a/packages/openscd/test/unit/Plugging.test.ts b/packages/openscd/test/unit/Plugging.test.ts
index 6f1d5e7a05..2d6aa63b7a 100644
--- a/packages/openscd/test/unit/Plugging.test.ts
+++ b/packages/openscd/test/unit/Plugging.test.ts
@@ -3,7 +3,7 @@ import { expect, fixture, html } from '@open-wc/testing';
 import '../mock-open-scd.js';
 import { MockOpenSCD } from '../mock-open-scd.js';
 import { TextField } from '@material/mwc-textfield';
-import { Plugin } from '../../src/plugin';
+import { Plugin, PluginConfig, PluginConfigMenu, PluginConfigNotMenu } from '../../src/plugin';
 import { ConfigurePluginDetail, newConfigurePluginEvent } from '../../src/plugin.events';
 import { generatePluginPath } from "../../src/plugins"
 
@@ -13,12 +13,20 @@ async function renderMockOpenSCD(
   docName: string = "testDoc",
   builtInPlugins: Plugin[] = builtinPlugins,
 ): Promise<MockOpenSCD>{
+
   const mockHTML = html`<mock-open-scd .mockPlugins=${builtInPlugins} .doc=${doc} .docName=${docName}></mock-open-scd>`
   const openscd = (await fixture(mockHTML)) as MockOpenSCD;
   await openscd.updateComplete;
   return openscd
 }
 
+function fetchDoc(path: string = '/test/testfiles/valid2007B4.scd'): Promise<XMLDocument>{
+  return fetch(path)
+    .then(response => response.text())
+    .then(str => new DOMParser().parseFromString(str, 'application/xml'));
+}
+
+
 describe('OpenSCD-Plugin', () => {
   let doc: XMLDocument;
   const docName = 'testDoc';
@@ -123,30 +131,20 @@ describe('OpenSCD-Plugin', () => {
 
     beforeEach(async () => {
       openscd = await renderMockOpenSCD(doc);
-      src = <TextField>(
-        openscd.layout.pluginDownloadUI.querySelector('#pluginSrcInput')
-      );
-      name = <TextField>(
-        openscd.layout.pluginDownloadUI.querySelector('#pluginNameInput')
-      );
-      primaryAction = <HTMLElement>(
-        openscd.layout.pluginDownloadUI.querySelector(
-          'mwc-button[slot="primaryAction"]'
-        )
-      );
+      src = openscd.layout.pluginDownloadUI.pluginSrcInput
+      name = openscd.layout.pluginDownloadUI.pluginNameInput
+      primaryAction = openscd.layout.pluginDownloadUI.addButton
       openscd.layout.pluginDownloadUI.show();
       await openscd.layout.pluginDownloadUI.updateComplete;
       await openscd.updateComplete;
       menuKindOption = <HTMLElement>(
-        openscd.layout.pluginDownloadUI.querySelector(
-          '#pluginKindList > mwc-radio-list-item[value="menu"]'
-        )
-      );
+        openscd.layout.pluginDownloadUI.pluginKindList
+          .querySelector('mwc-radio-list-item[value="menu"]')
+      )
       validatorKindOption = <HTMLElement>(
-        openscd.layout.pluginDownloadUI.querySelector(
-          '#pluginKindList > mwc-radio-list-item[id="validator"]'
-        )
-      );
+        openscd.layout.pluginDownloadUI.pluginKindList
+          .querySelector('mwc-radio-list-item[id="validator"]')
+      )
     });
 
     describe('requires a name and a valid URL to add a plugin', async () => {
@@ -179,7 +177,6 @@ describe('OpenSCD-Plugin', () => {
 
         src.value = 'http://localhost:8080/plugin/plugin.js';
         await src.updateComplete;
-
         primaryAction.click();
 
         expect(openscd.layout.pluginDownloadUI).to.have.property('open', false);
@@ -188,13 +185,16 @@ describe('OpenSCD-Plugin', () => {
     });
 
     it('adds a new editor kind plugin on add button click', async () => {
+      expect(openscd.layout.editors).to.have.lengthOf(3, getPluginNames(openscd.layout.editors).join(", "));
+
       src.value = 'http://example.com/plugin.js';
       name.value = 'testName';
       await src.updateComplete;
       await name.updateComplete;
       primaryAction.click();
       await openscd.updateComplete;
-      expect(openscd.layout.editors).to.have.lengthOf(15);
+
+      expect(openscd.layout.editors).to.have.lengthOf(4);
     });
 
     it('adds a new menu kind plugin on add button click', async () => {
@@ -227,6 +227,7 @@ describe('OpenSCD-Plugin', () => {
     });
     it('adds a new validator kind plugin on add button click', async () => {
       expect(openscd.layout.validators).to.have.lengthOf(2);
+
       src.value = 'http://example.com/plugin.js';
       name.value = 'testName';
       validatorKindOption.click();
@@ -234,6 +235,7 @@ describe('OpenSCD-Plugin', () => {
       await name.updateComplete;
       primaryAction.click();
       await openscd.updateComplete;
+
       expect(openscd.layout.validators).to.have.lengthOf(3);
     });
   });
@@ -244,6 +246,7 @@ describe('OpenSCD-Plugin', () => {
           desc: string
           currentPlugins: Plugin[]
           eventDetails: ConfigurePluginDetail
+          // expectedPlugins: Plugin[]
           expectedPlugins: Plugin[]
       }
 
@@ -262,7 +265,8 @@ describe('OpenSCD-Plugin', () => {
                   name: "new plugin",
                   kind: "editor",
                   src: "https://example.com/new-plugin.js",
-                  installed: false,
+                  active: false,
+                  activeByDefault: true,
                 },
               },
               expectedPlugins: [
@@ -270,7 +274,8 @@ describe('OpenSCD-Plugin', () => {
                   name: "new plugin",
                   kind: "editor",
                   src: "https://example.com/new-plugin.js",
-                  installed: false,
+                  activeByDefault: true,
+                  active: false,
                 }
               ]
           },
@@ -285,7 +290,8 @@ describe('OpenSCD-Plugin', () => {
                   name: "an existing plugin",
                   kind: "menu",
                   src: "https://example.com/new-plugin.js",
-                  installed: false,
+                  active: false,
+                  activeByDefault: true,
                 }
               ],
               eventDetails: {
@@ -295,7 +301,8 @@ describe('OpenSCD-Plugin', () => {
                   name: "an existing plugin",
                   kind: "editor",
                   src: "https://example.com/new-plugin.js",
-                  installed: false,
+                  active: false,
+                  activeByDefault: true,
                 },
               },
               expectedPlugins: [
@@ -303,13 +310,15 @@ describe('OpenSCD-Plugin', () => {
                   name: "an existing plugin",
                   kind: "menu",
                   src: "https://example.com/new-plugin.js",
-                  installed: false,
+                  active: false,
+                  activeByDefault: true,
                 },
                 {
                   name: "an existing plugin",
                   kind: "editor",
                   src: "https://example.com/new-plugin.js",
-                  installed: false,
+                  active: false,
+                  activeByDefault: true,
                 }
               ]
           },
@@ -323,7 +332,8 @@ describe('OpenSCD-Plugin', () => {
                   name: "I want to change this plugin",
                   kind: "editor",
                   src: "https://example.com/new-plugin.js",
-                  installed: false,
+                  active: false,
+                  activeByDefault: true,
                 }
               ],
               eventDetails: {
@@ -333,7 +343,8 @@ describe('OpenSCD-Plugin', () => {
                   name: "I want to change this plugin",
                   kind: "editor",
                   src: "https://example.com/changed-url.js",
-                  installed: true,
+                  active: true,
+                  activeByDefault: true,
                 },
               },
               expectedPlugins: [
@@ -341,7 +352,8 @@ describe('OpenSCD-Plugin', () => {
                   name: "I want to change this plugin",
                   kind: "editor",
                   src: "https://example.com/changed-url.js",
-                  installed: true,
+                  active: true,
+                  activeByDefault: true,
                 },
               ]
           },
@@ -354,7 +366,8 @@ describe('OpenSCD-Plugin', () => {
               name: "plugin to remove",
               kind: "editor",
               src: "https://example.com/plugin-to-remove.js",
-              installed: false,
+              active: false,
+              activeByDefault: true,
             }],
             eventDetails: {
               name: "plugin to remove",
@@ -372,7 +385,8 @@ describe('OpenSCD-Plugin', () => {
               name: "plugin to remove",
               kind: "editor",
               src: "https://example.com/plugin-to-remove.js",
-              installed: false,
+              active: false,
+                  activeByDefault: true,
             }],
             eventDetails: {
               name: "wrong name",
@@ -383,7 +397,8 @@ describe('OpenSCD-Plugin', () => {
               name: "plugin to remove",
               kind: "editor",
               src: "https://example.com/plugin-to-remove.js",
-              installed: false,
+              active: false,
+                  activeByDefault: true,
             }]
           },
           {
@@ -395,7 +410,8 @@ describe('OpenSCD-Plugin', () => {
               name: "plugin to remove, but wrong kind",
               kind: "editor",
               src: "https://example.com/plugin-to-remove.js",
-              installed: true,
+              active: true,
+              activeByDefault: true,
             }],
             eventDetails: {
               name: "plugin to remove, but wrong kind",
@@ -406,7 +422,8 @@ describe('OpenSCD-Plugin', () => {
               name: "plugin to remove, but wrong kind",
               kind: "editor",
               src: "https://example.com/plugin-to-remove.js",
-              installed: true,
+              active: true,
+              activeByDefault: true,
             }]
           },
       ]
@@ -434,7 +451,7 @@ describe('OpenSCD-Plugin', () => {
             // I could not figure how to compare the two lists
             // I've tried to use chai's deep.members and deep.include.members
             // and others but non of them worked.
-            const keys = ["name", "kind", "src", "installed"]
+            const keys = ["name", "kind", "src", "active", "activeByDefault"]
             const storedPlugins = openscd.layout.plugins.map((plugin) => {
               Object.keys(plugin).forEach((key) => {
                 if(!keys.includes(key)) {
@@ -454,284 +471,412 @@ describe('OpenSCD-Plugin', () => {
   })
 });
 
+describe("Bugs ", async () => {
+
+  it('Inconsistent behavior on refresh when using a local plugin #1622',async () => {
+
+
+    // ARRANGE
+    localStorage.clear()
+    const plugins = [
+      generateEditorPluginConfig({name: "editor-1"}),
+      generateMenuPluginConfig({name: "menu-1"}),
+      generateMenuPluginConfig({name: "menu-2"}),
+    ]
+    const doc = await fetchDoc()
+    const openscd = await renderMockOpenSCD(doc, "testDoc", plugins)
+    // @ts-ignore: we use the private function to arrange the scenario
+    openscd.storePlugins(plugins)
+    await openscd.requestUpdate()
+    await openscd.updateComplete
+    expect(openscd.layout.plugins).to.have.lengthOf(3, getPluginNames(openscd.layout.plugins).join(", "))
+
+    openscd.layout.pluginUI.show();
+    openscd.layout.pluginDownloadUI.show();
+    await openscd.layout.pluginUI.updateComplete;
+
+    // Add a custom plugin
+    const src = getCustomPluginSrcField(openscd)
+    const name = getCutomPluginNameField(openscd)
+    const addCustomPlugin = getCustomPluginAddButton(openscd)
+
+    name.value = "editor-test-1"
+    src.value = "http://localhost:8080/plugin-test-1.js"
+    await src.updateComplete;
+    await name.updateComplete;
+    addCustomPlugin.click()
+    await openscd.updateComplete;
+
+    expect(openscd.layout.plugins).to.have.lengthOf(4, getPluginNames(openscd.layout.plugins).join(", "))
+
+    openscd.layout.pluginUI.show();
+
+    const firstMenuPluginSrc = plugins[1].src
+    const firstMenuPlugin = openscd.layout.pluginUI?.shadowRoot?.querySelector(`mwc-check-list-item[value="${firstMenuPluginSrc}"]`)
+    const firstMenuPluginCheckbox = firstMenuPlugin?.shadowRoot?.querySelector('mwc-checkbox')
+    expect(firstMenuPluginCheckbox).to.not.be.null
+    expect(firstMenuPluginCheckbox).to.have.property('checked', true)
+
+    const secondMenuPluginSrc = plugins[2].src
+    const secondMenuPlugin = openscd.layout.pluginUI?.shadowRoot?.querySelector(`mwc-check-list-item[value="${secondMenuPluginSrc}"]`)
+    const secondMenuPluginChexkbox = secondMenuPlugin?.shadowRoot?.querySelector('mwc-checkbox')
+    expect(secondMenuPluginChexkbox).to.have.property('checked', true)
+
+
+    // ACT
+    firstMenuPluginCheckbox!.click()
+    await firstMenuPluginCheckbox!.updateComplete
+    await secondMenuPluginChexkbox!.updateComplete
+    await openscd.updateComplete;
+
+
+    // ASSERT
+    expect(firstMenuPluginCheckbox).to.have.property('checked', false)
+    expect(secondMenuPluginChexkbox).to.have.property('checked', true)
+
+
+  })
+})
+
+
+export function generateEditorPluginConfig( overwrite: Partial<Plugin> = {}): Plugin{
+
+  const randId = crypto.randomUUID().slice(0, 8)
+  const defaultConfig: Plugin = {
+    kind:  'editor',
+    name: `Editor Plugin #${randId}`,
+    src: `http://example.com/plugin-${randId}.js`,
+    active: true,
+    activeByDefault: true,
+    official: true,
+    icon: 'developer_board',
+    requireDoc: true,
+  }
+
+  return {
+    ...defaultConfig,
+    ...overwrite,
+  }
+}
+
+export function generateMenuPluginConfig( overwrite: Partial<Plugin> = {}): Plugin{
+
+  const randId = crypto.randomUUID().slice(0, 8)
+  const defaultConfig: Plugin = {
+    kind:  'menu',
+    name: `Menu Plugin #${randId}`,
+    src: `http://example.com/plugin-${randId}.js`,
+    active: true,
+    position: 'top',
+    activeByDefault: true,
+    official: true,
+    icon: 'developer_board',
+    requireDoc: true,
+  }
+
+  return {
+    ...defaultConfig,
+    ...overwrite,
+  }
+}
+
 const builtinPlugins: Plugin[] = [
   {
     name: 'IED',
     src: generatePluginPath('plugins/src/editors/IED.js'),
     icon: 'developer_board',
-    default: true,
+    activeByDefault: true,
     kind: 'editor',
     requireDoc: true,
-    installed: true,
+    active: true,
   },
   {
     name: 'Substation',
     src: generatePluginPath('plugins/src/editors/Substation.js'),
     icon: 'margin',
-    default: true,
+    activeByDefault: true,
     kind: 'editor',
     requireDoc: true,
-    installed: true,
+    active: true,
   },
   {
     name: 'Single Line Diagram',
     src: generatePluginPath('plugins/src/editors/SingleLineDiagram.js'),
     icon: 'edit',
-    default: false,
-    kind: 'editor',
-    requireDoc: true,
-    installed: true,
-  },
-  {
-    name: 'Subscriber Message Binding (GOOSE)',
-    src: generatePluginPath('plugins/src/editors/GooseSubscriberMessageBinding.js'),
-    icon: 'link',
-    default: false,
-    kind: 'editor',
-    requireDoc: true,
-    installed: true,
-  },
-  {
-    name: 'Subscriber Data Binding (GOOSE)',
-    src: generatePluginPath('plugins/src/editors/GooseSubscriberDataBinding.js'),
-    icon: 'link',
-    default: false,
-    kind: 'editor',
-    requireDoc: true,
-    installed: true,
-  },
-  {
-    name: 'Subscriber Later Binding (GOOSE)',
-    src: generatePluginPath('plugins/src/editors/GooseSubscriberLaterBinding.js'),
-    icon: 'link',
-    default: true,
-    kind: 'editor',
-    requireDoc: true,
-    installed: true,
-  },
-  {
-    name: 'Subscriber Message Binding (SMV)',
-    src: generatePluginPath('plugins/src/editors/SMVSubscriberMessageBinding.js'),
-    icon: 'link',
-    default: false,
-    kind: 'editor',
-    requireDoc: true,
-    installed: true,
-  },
-  {
-    name: 'Subscriber Data Binding (SMV)',
-    src: generatePluginPath('plugins/src/editors/SMVSubscriberDataBinding.js'),
-    icon: 'link',
-    default: false,
-    kind: 'editor',
-    requireDoc: true,
-    installed: true,
-  },
-  {
-    name: 'Subscriber Later Binding (SMV)',
-    src: generatePluginPath('plugins/src/editors/SMVSubscriberLaterBinding.js'),
-    icon: 'link',
-    default: true,
-    kind: 'editor',
-    requireDoc: true,
-    installed: true,
-  },
-  {
-    name: 'Communication',
-    src: generatePluginPath('plugins/src/editors/Communication.js'),
-    icon: 'settings_ethernet',
-    default: true,
-    kind: 'editor',
-    requireDoc: true,
-    installed: true,
-  },
-  {
-    name: '104',
-    src: generatePluginPath('plugins/src/editors/Protocol104.js'),
-    icon: 'settings_ethernet',
-    default: false,
-    kind: 'editor',
-    requireDoc: true,
-    installed: true,
-  },
-  {
-    name: 'Templates',
-    src: generatePluginPath('plugins/src/editors/Templates.js'),
-    icon: 'copy_all',
-    default: true,
-    kind: 'editor',
-    requireDoc: true,
-    installed: true,
-  },
-  {
-    name: 'Publisher',
-    src: generatePluginPath('plugins/src/editors/Publisher.js'),
-    icon: 'publish',
-    default: false,
-    kind: 'editor',
-    requireDoc: true,
-    installed: true,
-  },
-  {
-    name: 'Cleanup',
-    src: generatePluginPath('plugins/src/editors/Cleanup.js'),
-    icon: 'cleaning_services',
-    default: false,
+    activeByDefault: true,
     kind: 'editor',
     requireDoc: true,
-    installed: true,
+    active: true,
   },
+  // {
+  //   name: 'Subscriber Message Binding (GOOSE)',
+  //   src: generatePluginPath('plugins/src/editors/GooseSubscriberMessageBinding.js'),
+  //   icon: 'link',
+  //   activeByDefault: false,
+  //   kind: 'editor',
+  //   requireDoc: true,
+  //   active: true,
+  // },
+  // {
+  //   name: 'Subscriber Data Binding (GOOSE)',
+  //   src: generatePluginPath('plugins/src/editors/GooseSubscriberDataBinding.js'),
+  //   icon: 'link',
+  //   activeByDefault: false,
+  //   kind: 'editor',
+  //   requireDoc: true,
+  //   active: true,
+  // },
+  // {
+  //   name: 'Subscriber Later Binding (GOOSE)',
+  //   src: generatePluginPath('plugins/src/editors/GooseSubscriberLaterBinding.js'),
+  //   icon: 'link',
+  //   activeByDefault: true,
+  //   kind: 'editor',
+  //   requireDoc: true,
+  //   active: true,
+  // },
+  // {
+  //   name: 'Subscriber Message Binding (SMV)',
+  //   src: generatePluginPath('plugins/src/editors/SMVSubscriberMessageBinding.js'),
+  //   icon: 'link',
+  //   activeByDefault: false,
+  //   kind: 'editor',
+  //   requireDoc: true,
+  //   active: true,
+  // },
+  // {
+  //   name: 'Subscriber Data Binding (SMV)',
+  //   src: generatePluginPath('plugins/src/editors/SMVSubscriberDataBinding.js'),
+  //   icon: 'link',
+  //   activeByDefault: false,
+  //   kind: 'editor',
+  //   requireDoc: true,
+  //   active: true,
+  // },
+  // {
+  //   name: 'Subscriber Later Binding (SMV)',
+  //   src: generatePluginPath('plugins/src/editors/SMVSubscriberLaterBinding.js'),
+  //   icon: 'link',
+  //   activeByDefault: true,
+  //   kind: 'editor',
+  //   requireDoc: true,
+  //   active: true,
+  // },
+  // {
+  //   name: 'Communication',
+  //   src: generatePluginPath('plugins/src/editors/Communication.js'),
+  //   icon: 'settings_ethernet',
+  //   activeByDefault: true,
+  //   kind: 'editor',
+  //   requireDoc: true,
+  //   active: true,
+  // },
+  // {
+  //   name: '104',
+  //   src: generatePluginPath('plugins/src/editors/Protocol104.js'),
+  //   icon: 'settings_ethernet',
+  //   activeByDefault: false,
+  //   kind: 'editor',
+  //   requireDoc: true,
+  //   active: true,
+  // },
+  // {
+  //   name: 'Templates',
+  //   src: generatePluginPath('plugins/src/editors/Templates.js'),
+  //   icon: 'copy_all',
+  //   activeByDefault: true,
+  //   kind: 'editor',
+  //   requireDoc: true,
+  //   active: true,
+  // },
+  // {
+  //   name: 'Publisher',
+  //   src: generatePluginPath('plugins/src/editors/Publisher.js'),
+  //   icon: 'publish',
+  //   activeByDefault: false,
+  //   kind: 'editor',
+  //   requireDoc: true,
+  //   active: true,
+  // },
+  // {
+  //   name: 'Cleanup',
+  //   src: generatePluginPath('plugins/src/editors/Cleanup.js'),
+  //   icon: 'cleaning_services',
+  //   activeByDefault: false,
+  //   kind: 'editor',
+  //   requireDoc: true,
+  //   active: true,
+  // },
   {
     name: 'Open project',
     src: generatePluginPath('plugins/src/menu/OpenProject.js'),
     icon: 'folder_open',
-    default: true,
+    activeByDefault: true,
     kind: 'menu',
     requireDoc: false,
-    installed: true,
+    active: true,
     position: 'top',
   },
   {
     name: 'New project',
     src: generatePluginPath('plugins/src/menu/NewProject.js'),
     icon: 'create_new_folder',
-    default: true,
+    activeByDefault: true,
     kind: 'menu',
     requireDoc: false,
-    installed: true,
+    active: true,
     position: 'top',
   },
   {
     name: 'Save project',
     src: generatePluginPath('plugins/src/menu/SaveProject.js'),
     icon: 'save',
-    default: true,
+    activeByDefault: true,
     kind: 'menu',
     requireDoc: true,
-    installed: true,
+    active: true,
     position: 'top',
   },
   {
     name: 'Validate Schema',
     src: generatePluginPath('plugins/src/validators/ValidateSchema.js'),
     icon: 'rule_folder',
-    default: true,
+    activeByDefault: true,
     kind: 'validator',
-    installed: true,
+    active: true,
   },
   {
     name: 'Validate Templates',
     src: generatePluginPath('plugins/src/validators/ValidateTemplates.js'),
     icon: 'rule_folder',
-    default: true,
+    activeByDefault: true,
     kind: 'validator',
-    installed: true,
+    active: true,
   },
   {
     name: 'Import IEDs',
     src: generatePluginPath('plugins/src/menu/ImportIEDs.js'),
     icon: 'snippet_folder',
-    default: true,
+    activeByDefault: true,
     kind: 'menu',
     requireDoc: true,
-    installed: true,
+    active: true,
     position: 'middle',
   },
   {
     name: 'Create Virtual IED',
     src: generatePluginPath('plugins/src/menu/VirtualTemplateIED.js'),
     icon: 'developer_board',
-    default: false,
+    activeByDefault: false,
     kind: 'menu',
     requireDoc: true,
-    installed: true,
+    active: true,
     position: 'middle',
   },
   {
     name: 'Subscriber Update',
     src: generatePluginPath('plugins/src/menu/SubscriberInfo.js'),
-    default: true,
-    kind: 'menu',
-    requireDoc: true,
-    installed: true,
-    position: 'middle',
-  },
-  {
-    name: 'Update desc (ABB)',
-    src: generatePluginPath('plugins/src/menu/UpdateDescriptionABB.js'),
-    default: false,
-    kind: 'menu',
-    requireDoc: true,
-    installed: true,
-    position: 'middle',
-  },
-  {
-    name: 'Update desc (SEL)',
-    src: generatePluginPath('plugins/src/menu/UpdateDescriptionSEL.js'),
-    default: false,
-    kind: 'menu',
-    requireDoc: true,
-    installed: true,
-    position: 'middle',
-  },
-  {
-    name: 'Merge Project',
-    src: generatePluginPath('plugins/src/menu/Merge.js'),
-    icon: 'merge_type',
-    default: true,
-    kind: 'menu',
-    requireDoc: true,
-    installed: true,
-    position: 'middle',
-  },
-  {
-    name: 'Update Substation',
-    src: generatePluginPath('plugins/src/menu/UpdateSubstation.js'),
-    icon: 'merge_type',
-    default: true,
-    kind: 'menu',
-    requireDoc: true,
-    installed: true,
-    position: 'middle',
-  },
-  {
-    name: 'Compare IED',
-    src: generatePluginPath('plugins/src/menu/CompareIED.js'),
-    icon: 'compare_arrows',
-    default: true,
-    kind: 'menu',
-    requireDoc: true,
-    installed: true,
-    position: 'middle',
-  },
-  {
-    name: 'Show SCL History',
-    src: generatePluginPath('plugins/src/menu/SclHistory.js'),
-    icon: 'history_toggle_off',
-    default: true,
-    kind: 'menu',
-    requireDoc: true,
-    installed: true,
-    position: 'bottom',
-  },
-  {
-    name: 'Help',
-    src: generatePluginPath('plugins/src/menu/Help.js'),
-    icon: 'help',
-    default: true,
-    kind: 'menu',
-    requireDoc: false,
-    installed: true,
-    position: 'bottom',
-  },
-  {
-    name: 'Export Communication Section',
-    src: generatePluginPath('plugins/src/menu/ExportCommunication.js'),
-    icon: 'sim_card_download',
-    default: false,
+    activeByDefault: true,
     kind: 'menu',
     requireDoc: true,
-    installed: true,
+    active: true,
     position: 'middle',
   },
+  // {
+  //   name: 'Update desc (ABB)',
+  //   src: generatePluginPath('plugins/src/menu/UpdateDescriptionABB.js'),
+  //   activeByDefault: false,
+  //   kind: 'menu',
+  //   requireDoc: true,
+  //   active: true,
+  //   position: 'middle',
+  // },
+  // {
+  //   name: 'Update desc (SEL)',
+  //   src: generatePluginPath('plugins/src/menu/UpdateDescriptionSEL.js'),
+  //   activeByDefault: false,
+  //   kind: 'menu',
+  //   requireDoc: true,
+  //   active: true,
+  //   position: 'middle',
+  // },
+  // {
+  //   name: 'Merge Project',
+  //   src: generatePluginPath('plugins/src/menu/Merge.js'),
+  //   icon: 'merge_type',
+  //   activeByDefault: true,
+  //   kind: 'menu',
+  //   requireDoc: true,
+  //   active: true,
+  //   position: 'middle',
+  // },
+  // {
+  //   name: 'Update Substation',
+  //   src: generatePluginPath('plugins/src/menu/UpdateSubstation.js'),
+  //   icon: 'merge_type',
+  //   activeByDefault: true,
+  //   kind: 'menu',
+  //   requireDoc: true,
+  //   active: true,
+  //   position: 'middle',
+  // },
+  // {
+  //   name: 'Compare IED',
+  //   src: generatePluginPath('plugins/src/menu/CompareIED.js'),
+  //   icon: 'compare_arrows',
+  //   activeByDefault: true,
+  //   kind: 'menu',
+  //   requireDoc: true,
+  //   active: true,
+  //   position: 'middle',
+  // },
+  // {
+  //   name: 'Show SCL History',
+  //   src: generatePluginPath('plugins/src/menu/SclHistory.js'),
+  //   icon: 'history_toggle_off',
+  //   activeByDefault: true,
+  //   kind: 'menu',
+  //   requireDoc: true,
+  //   active: true,
+  //   position: 'bottom',
+  // },
+  // {
+  //   name: 'Help',
+  //   src: generatePluginPath('plugins/src/menu/Help.js'),
+  //   icon: 'help',
+  //   activeByDefault: true,
+  //   kind: 'menu',
+  //   requireDoc: false,
+  //   active: true,
+  //   position: 'bottom',
+  // },
+  // {
+  //   name: 'Export Communication Section',
+  //   src: generatePluginPath('plugins/src/menu/ExportCommunication.js'),
+  //   icon: 'sim_card_download',
+  //   activeByDefault: false,
+  //   kind: 'menu',
+  //   requireDoc: true,
+  //   active: true,
+  //   position: 'middle',
+  // },
 ];
+
+
+function getPluginNames(plugins: Plugin[]): string[]{
+  return plugins.map(plugin => plugin.name)
+}
+
+function getCustomPluginSrcField(openscd: MockOpenSCD): TextField {
+  return openscd.layout.pluginDownloadUI.pluginSrcInput
+}
+
+function getCutomPluginNameField(openscd: MockOpenSCD): TextField {
+  return openscd.layout.pluginDownloadUI.pluginNameInput
+}
+
+
+function getCustomPluginAddButton(openscd: MockOpenSCD): HTMLElement {
+  return openscd.layout.pluginDownloadUI.addButton
+}
+
diff --git a/packages/plugins/test/integration/editors/__snapshots__/IED.test.snap.js b/packages/plugins/test/integration/editors/__snapshots__/IED.test.snap.js
index d8cf210dae..2e0ad05334 100644
--- a/packages/plugins/test/integration/editors/__snapshots__/IED.test.snap.js
+++ b/packages/plugins/test/integration/editors/__snapshots__/IED.test.snap.js
@@ -34,7 +34,6 @@ snapshots["IED Plugin with a doc loaded containing IEDs looks like the latest sn
         aria-selected="true"
         graphic="control"
         mwc-list-item=""
-        selected=""
         tabindex="0"
         twoline=""
         value="IED1"