@compas-oscd/open-scd 0.34.12 → 0.34.14

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@compas-oscd/open-scd",
-  "version": "0.34.12",
+  "version": "0.34.14",
   "repository": "https://github.com/openscd/open-scd.git",
   "directory": "packages/openscd",
   "description": "A bottom-up substation configuration designer for projects described using SCL `IEC 61850-6` Edition 2 or greater.",

package/dist/src/WizardDivider.d.ts

@@ -1,8 +0,0 @@
-import { LitElement, TemplateResult } from 'lit-element';
-export declare class WizardDividerElement extends LitElement {
-    header?: string;
-    render(): TemplateResult;
-    private renderHeader;
-    private renderSeparator;
-    static styles: import("lit-element").CSSResult;
-}

package/dist/src/WizardDivider.js

@@ -1,37 +0,0 @@
-import { __decorate } from "tslib";
-import { css, customElement, html, LitElement, property, } from 'lit-element';
-let WizardDividerElement = class WizardDividerElement extends LitElement {
-    render() {
-        return html ` ${this.renderHeader()} ${this.renderSeparator()}`;
-    }
-    renderHeader() {
-        if (!this.header) {
-            return html ``;
-        }
-        return html `<h4 class="header">${this.header}</h4>`;
-    }
-    renderSeparator() {
-        return html `<div role="separator"></div>`;
-    }
-};
-WizardDividerElement.styles = css `
-    div {
-      height: 0px;
-      margin: 10px 0px 10px 0px;
-      border-top: none;
-      border-right: none;
-      border-left: none;
-      border-image: initial;
-      border-bottom: 1px solid rgba(0, 0, 0, 0.12);
-    }
-  `;
-__decorate([
-    property({
-        type: String,
-    })
-], WizardDividerElement.prototype, "header", void 0);
-WizardDividerElement = __decorate([
-    customElement('wizard-divider')
-], WizardDividerElement);
-export { WizardDividerElement };
-//# sourceMappingURL=WizardDivider.js.map

package/dist/src/WizardDivider.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"WizardDivider.js","sourceRoot":"","sources":["../../src/WizardDivider.ts"],"names":[],"mappings":";AAAA,OAAO,EACL,GAAG,EACH,aAAa,EACb,IAAI,EACJ,UAAU,EACV,QAAQ,GAET,MAAM,aAAa,CAAC;AAGd,IAAM,oBAAoB,GAA1B,MAAM,oBAAqB,SAAQ,UAAU;IAMlD,MAAM;QACJ,OAAO,IAAI,CAAA,IAAI,IAAI,CAAC,YAAY,EAAE,IAAI,IAAI,CAAC,eAAe,EAAE,EAAE,CAAC;IACjE,CAAC;IAEO,YAAY;QAClB,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE;YAChB,OAAO,IAAI,CAAA,EAAE,CAAC;SACf;QAED,OAAO,IAAI,CAAA,sBAAsB,IAAI,CAAC,MAAM,OAAO,CAAC;IACtD,CAAC;IAEO,eAAe;QACrB,OAAO,IAAI,CAAA,8BAA8B,CAAC;IAC5C,CAAC;;AAEM,2BAAM,GAAG,GAAG,CAAA;;;;;;;;;;GAUlB,CAAC;AA5BF;IAHC,QAAQ,CAAC;QACR,IAAI,EAAE,MAAM;KACb,CAAC;oDACc;AAJL,oBAAoB;IADhC,aAAa,CAAC,gBAAgB,CAAC;GACnB,oBAAoB,CAiChC;SAjCY,oBAAoB","sourcesContent":["import {\n  css,\n  customElement,\n  html,\n  LitElement,\n  property,\n  TemplateResult,\n} from 'lit-element';\n\n@customElement('wizard-divider')\nexport class WizardDividerElement extends LitElement {\n  @property({\n    type: String,\n  })\n  header?: string;\n\n  render(): TemplateResult {\n    return html` ${this.renderHeader()} ${this.renderSeparator()}`;\n  }\n\n  private renderHeader(): TemplateResult {\n    if (!this.header) {\n      return html``;\n    }\n\n    return html`<h4 class=\"header\">${this.header}</h4>`;\n  }\n\n  private renderSeparator(): TemplateResult {\n    return html`<div role=\"separator\"></div>`;\n  }\n\n  static styles = css`\n    div {\n      height: 0px;\n      margin: 10px 0px 10px 0px;\n      border-top: none;\n      border-right: none;\n      border-left: none;\n      border-image: initial;\n      border-bottom: 1px solid rgba(0, 0, 0, 0.12);\n    }\n  `;\n}\n"]}

package/dist/src/Wizarding.d.ts

@@ -1,10 +0,0 @@
-import { LitElementConstructor, Mixin, WizardFactory } from './foundation.js';
-import './wizard-dialog.js';
-import { WizardDialog } from './wizard-dialog.js';
-/** `LitElement` mixin that adds a `workflow` property which [[`Wizard`]]s are
- * queued onto on incoming [[`WizardEvent`]]s, first come first displayed. */
-export type WizardingElement = Mixin<typeof Wizarding>;
-export declare function Wizarding<TBase extends LitElementConstructor>(Base: TBase): TBase & (new (...args: any[]) => {
-    workflow: WizardFactory[];
-    wizardUI: WizardDialog;
-});

package/dist/src/Wizarding.js

@@ -1,38 +0,0 @@
-import { __decorate } from "tslib";
-import { html, state, query } from 'lit-element';
-import { ifImplemented, } from './foundation.js';
-import './wizard-dialog.js';
-export function Wizarding(Base) {
-    class WizardingElement extends Base {
-        onWizard(we) {
-            const wizard = we.detail.wizard;
-            if (wizard === null)
-                this.workflow.shift();
-            else if (we.detail.subwizard)
-                this.workflow.unshift(wizard);
-            else
-                this.workflow.push(wizard);
-            this.requestUpdate('workflow');
-            this.updateComplete.then(() => this.wizardUI.updateComplete.then(() => this.wizardUI.dialog?.updateComplete.then(() => this.wizardUI.dialog?.focus())));
-        }
-        constructor(...args) {
-            super(...args);
-            /** FIFO queue of [[`Wizard`]]s to display. */
-            this.workflow = [];
-            this.addEventListener('wizard', this.onWizard);
-            this.addEventListener('editor-action', () => this.wizardUI.requestUpdate());
-        }
-        render() {
-            return html `${ifImplemented(super.render())}
-        <wizard-dialog .wizard=${this.workflow[0]?.() ?? []}></wizard-dialog>`;
-        }
-    }
-    __decorate([
-        state()
-    ], WizardingElement.prototype, "workflow", void 0);
-    __decorate([
-        query('wizard-dialog')
-    ], WizardingElement.prototype, "wizardUI", void 0);
-    return WizardingElement;
-}
-//# sourceMappingURL=Wizarding.js.map

package/dist/src/Wizarding.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Wizarding.js","sourceRoot":"","sources":["../../src/Wizarding.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAkB,KAAK,EAAE,MAAM,aAAa,CAAC;AACjE,OAAO,EACL,aAAa,GAKd,MAAM,iBAAiB,CAAC;AAEzB,OAAO,oBAAoB,CAAC;AAO5B,MAAM,UAAU,SAAS,CACvB,IAAW;IAKX,MAAM,gBAAiB,SAAQ,IAAI;QAOzB,QAAQ,CAAC,EAAe;YAC9B,MAAM,MAAM,GAAG,EAAE,CAAC,MAAM,CAAC,MAAM,CAAC;YAChC,IAAI,MAAM,KAAK,IAAI;gBAAE,IAAI,CAAC,QAAQ,CAAC,KAAK,EAAE,CAAC;iBACtC,IAAI,EAAE,CAAC,MAAM,CAAC,SAAS;gBAAE,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;;gBACvD,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;YAChC,IAAI,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;YAC/B,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,GAAG,EAAE,CAC5B,IAAI,CAAC,QAAQ,CAAC,cAAc,CAAC,IAAI,CAAC,GAAG,EAAE,CACrC,IAAI,CAAC,QAAQ,CAAC,MAAM,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,EAAE,CAC7C,IAAI,CAAC,QAAQ,CAAC,MAAM,EAAE,KAAK,EAAE,CAC9B,CACF,CACF,CAAC;QACJ,CAAC;QAED,YAAY,GAAG,IAAW;YACxB,KAAK,CAAC,GAAG,IAAI,CAAC,CAAC;YAtBjB,8CAA8C;YAE9C,aAAQ,GAAoB,EAAE,CAAC;YAsB7B,IAAI,CAAC,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;YAC/C,IAAI,CAAC,gBAAgB,CAAC,eAAe,EAAE,GAAG,EAAE,CAC1C,IAAI,CAAC,QAAQ,CAAC,aAAa,EAAE,CAC9B,CAAC;QACJ,CAAC;QAED,MAAM;YACJ,OAAO,IAAI,CAAA,GAAG,aAAa,CAAC,KAAK,CAAC,MAAM,EAAE,CAAC;iCAChB,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,EAAE,IAAI,EAAE,mBAAmB,CAAC;QAC3E,CAAC;KACF;IAhCC;QADC,KAAK,EAAE;sDACuB;IAEP;QAAvB,KAAK,CAAC,eAAe,CAAC;sDAAyB;IAgClD,OAAO,gBAAuB,CAAC;AACjC,CAAC","sourcesContent":["import { html, state, TemplateResult, query } from 'lit-element';\nimport {\n  ifImplemented,\n  LitElementConstructor,\n  Mixin,\n  WizardEvent,\n  WizardFactory,\n} from './foundation.js';\n\nimport './wizard-dialog.js';\nimport { WizardDialog } from './wizard-dialog.js';\n\n/** `LitElement` mixin that adds a `workflow` property which [[`Wizard`]]s are\n * queued onto on incoming [[`WizardEvent`]]s, first come first displayed. */\nexport type WizardingElement = Mixin<typeof Wizarding>;\n\nexport function Wizarding<TBase extends LitElementConstructor>(\n  Base: TBase\n): TBase & (new (...args: any[]) => {\n  workflow: WizardFactory[];\n  wizardUI: WizardDialog;\n}) {\n  class WizardingElement extends Base {\n    /** FIFO queue of [[`Wizard`]]s to display. */\n    @state()\n    workflow: WizardFactory[] = [];\n\n    @query('wizard-dialog') wizardUI!: WizardDialog;\n\n    private onWizard(we: WizardEvent) {\n      const wizard = we.detail.wizard;\n      if (wizard === null) this.workflow.shift();\n      else if (we.detail.subwizard) this.workflow.unshift(wizard);\n      else this.workflow.push(wizard);\n      this.requestUpdate('workflow');\n      this.updateComplete.then(() =>\n        this.wizardUI.updateComplete.then(() =>\n          this.wizardUI.dialog?.updateComplete.then(() =>\n            this.wizardUI.dialog?.focus()\n          )\n        )\n      );\n    }\n\n    constructor(...args: any[]) {\n      super(...args);\n\n      this.addEventListener('wizard', this.onWizard);\n      this.addEventListener('editor-action', () =>\n        this.wizardUI.requestUpdate()\n      );\n    }\n\n    render(): TemplateResult {\n      return html`${ifImplemented(super.render())}\n        <wizard-dialog .wizard=${this.workflow[0]?.() ?? []}></wizard-dialog>`;\n    }\n  }\n\n  return WizardingElement as any;\n}\n"]}

package/dist/src/action-icon.d.ts

@@ -1,25 +0,0 @@
-import { LitElement, TemplateResult } from 'lit-element';
-import '@material/mwc-icon';
-/**
- * A responsive container rendering actions in a header.
- *
- * The "action" slot may contain up to eight icon buttons.
- * The "icon" slot, if filled overrides the icon property.
- * The default slot will be rendered into the pane body in a single column.
- */
-export declare class ActionIcon extends LitElement {
-    /** caption text, displayed in the header */
-    label?: string;
-    /** icon name, displayed unless the "icon" slot is filled */
-    icon?: string;
-    /** color header with secondary theme color while focus is within */
-    secondary: boolean;
-    /** highlight pane with dotted outline */
-    highlighted: boolean;
-    /** disables CSS adoption to action buttons */
-    hideActions: boolean;
-    firstUpdated(): Promise<void>;
-    private renderIcon;
-    render(): TemplateResult;
-    static styles: import("lit-element").CSSResult;
-}

package/dist/src/action-icon.js

@@ -1,220 +0,0 @@
-import { __decorate } from "tslib";
-import { css, customElement, html, LitElement, property, } from 'lit-element';
-import { nothing } from 'lit-html';
-import '@material/mwc-icon';
-/**
- * A responsive container rendering actions in a header.
- *
- * The "action" slot may contain up to eight icon buttons.
- * The "icon" slot, if filled overrides the icon property.
- * The default slot will be rendered into the pane body in a single column.
- */
-let ActionIcon = class ActionIcon extends LitElement {
-    constructor() {
-        super(...arguments);
-        /** color header with secondary theme color while focus is within */
-        this.secondary = false;
-        /** highlight pane with dotted outline */
-        this.highlighted = false;
-        /** disables CSS adoption to action buttons */
-        this.hideActions = false;
-    }
-    async firstUpdated() {
-        this.tabIndex = 0;
-    }
-    renderIcon() {
-        return html `<span>
-      <slot name="icon"
-        >${this.icon ? html `<mwc-icon>${this.icon}</mwc-icon>` : nothing}</slot
-      ></span
-    > `;
-    }
-    render() {
-        return html `<header>${this.label ?? nothing}</header>
-      <section>${this.renderIcon()}<slot name="action"></slot></section>
-      <footer>${this.label ?? nothing}</footer>`;
-    }
-};
-ActionIcon.styles = css `
-    :host {
-      display: flex;
-      flex-direction: column;
-      outline: none;
-    }
-
-    section {
-      align-self: center;
-    }
-
-    ::slotted([slot='icon']),
-    mwc-icon {
-      display: block;
-      color: var(--mdc-theme-on-surface);
-      transition: transform 150ms linear, box-shadow 200ms linear;
-      outline-color: var(--mdc-theme-primary);
-      outline-style: solid;
-      margin: 0px;
-      outline-width: 0px;
-      width: 64px;
-      height: 64px;
-      --mdc-icon-size: 64px;
-    }
-
-    :host([secondary]) ::slotted([slot='icon']),
-    :host([secondary]) mwc-icon {
-      outline-color: var(--mdc-theme-secondary);
-    }
-
-    :host([highlighted]) ::slotted([slot='icon']),
-    :host([highlighted]) mwc-icon {
-      outline-style: dotted;
-      outline-width: 2px;
-    }
-
-    :host(:focus-within) ::slotted([slot='icon']),
-    :host(:focus-within) mwc-icon {
-      outline-style: solid;
-      outline-width: 4px;
-    }
-
-    :host(:focus-within:not([hideActions])) ::slotted([slot='icon']),
-    :host(:focus-within:not([hideActions])) mwc-icon {
-      transform: scale(0.8);
-      transition: all 250ms linear;
-      box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14),
-        0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2);
-    }
-
-    ::slotted([slot='icon']:hover),
-    mwc-icon:hover {
-      outline-style: dashed;
-      outline-width: 2px;
-      transition: transform 200ms linear, box-shadow 250ms linear;
-    }
-
-    ::slotted([slot='action']) {
-      color: var(--mdc-theme-on-surface);
-      transition: transform 200ms cubic-bezier(0.4, 0, 0.2, 1),
-        opacity 200ms linear;
-      position: absolute;
-      pointer-events: none;
-      z-index: 1;
-      opacity: 0;
-      margin-top: -56px;
-      margin-left: 8px;
-    }
-
-    :host(:focus-within) ::slotted([slot='action']) {
-      transition: transform 250ms cubic-bezier(0.4, 0, 0.2, 1),
-        opacity 250ms linear;
-      pointer-events: auto;
-      opacity: 1;
-    }
-
-    :host(:focus-within) ::slotted([slot='action']:nth-of-type(1)) {
-      transform: translate(0px, -52px);
-    }
-    :host(:focus-within) ::slotted([slot='action']:nth-of-type(2)) {
-      transform: translate(0px, 52px);
-    }
-    :host(:focus-within) ::slotted([slot='action']:nth-of-type(3)) {
-      transform: translate(52px, 0px);
-    }
-    :host(:focus-within) ::slotted([slot='action']:nth-of-type(4)) {
-      transform: translate(-52px, 0px);
-    }
-    :host(:focus-within) ::slotted([slot='action']:nth-of-type(5)) {
-      transform: translate(52px, -52px);
-    }
-    :host(:focus-within) ::slotted([slot='action']:nth-of-type(6)) {
-      transform: translate(-52px, 52px);
-    }
-    :host(:focus-within) ::slotted([slot='action']:nth-of-type(7)) {
-      transform: translate(-52px, -52px);
-    }
-    :host(:focus-within) ::slotted([slot='action']:nth-of-type(8)) {
-      transform: translate(52px, 52px);
-    }
-
-    footer {
-      color: var(--mdc-theme-on-surface);
-      font-family: 'Roboto', sans-serif;
-      font-weight: 300;
-      overflow: hidden;
-      white-space: nowrap;
-      text-overflow: ellipsis;
-      margin: 0px;
-      text-align: center;
-      align-self: center;
-      max-width: 100%;
-      direction: rtl;
-    }
-
-    header {
-      color: var(--mdc-theme-on-primary);
-      background-color: var(--mdc-theme-primary);
-      font-family: 'Roboto', sans-serif;
-      font-weight: 500;
-      font-size: 1.2em;
-      position: absolute;
-      text-align: center;
-      align-self: center;
-      max-width: 100vw;
-      padding: 4px 8px;
-      border-radius: 4px;
-      opacity: 0;
-      transition: transform 200ms cubic-bezier(0.4, 0, 0.2, 1),
-        opacity 200ms linear;
-    }
-
-    :host([secondary]) header {
-      background-color: var(--mdc-theme-secondary);
-    }
-
-    :host(:hover) header {
-      position: absolute;
-      opacity: 1;
-      transform: translate(0, -40px);
-      box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14),
-        0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2);
-      transition: transform 250ms cubic-bezier(0.4, 0, 0.2, 1),
-        opacity 250ms linear;
-    }
-
-    :host(:focus-within) header {
-      position: absolute;
-      opacity: 1;
-      box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14),
-        0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2);
-      transition: transform 250ms cubic-bezier(0.4, 0, 0.2, 1),
-        opacity 250ms linear;
-    }
-
-    :host(:focus-within:not([hideActions])) header {
-      transform: translate(0, -80px);
-    }
-
-    :host(:focus-within[hideActions]) header {
-      transform: translate(0, -40px);
-    }
-  `;
-__decorate([
-    property({ type: String })
-], ActionIcon.prototype, "label", void 0);
-__decorate([
-    property({ type: String })
-], ActionIcon.prototype, "icon", void 0);
-__decorate([
-    property({ type: Boolean })
-], ActionIcon.prototype, "secondary", void 0);
-__decorate([
-    property({ type: Boolean })
-], ActionIcon.prototype, "highlighted", void 0);
-__decorate([
-    property({ type: Boolean })
-], ActionIcon.prototype, "hideActions", void 0);
-ActionIcon = __decorate([
-    customElement('action-icon')
-], ActionIcon);
-export { ActionIcon };
-//# sourceMappingURL=action-icon.js.map

package/dist/src/action-icon.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"action-icon.js","sourceRoot":"","sources":["../../src/action-icon.ts"],"names":[],"mappings":";AAAA,OAAO,EACL,GAAG,EACH,aAAa,EACb,IAAI,EACJ,UAAU,EACV,QAAQ,GAET,MAAM,aAAa,CAAC;AACrB,OAAO,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AAEnC,OAAO,oBAAoB,CAAC;AAE5B;;;;;;GAMG;AAEI,IAAM,UAAU,GAAhB,MAAM,UAAW,SAAQ,UAAU;IAAnC;;QAOL,oEAAoE;QAEpE,cAAS,GAAG,KAAK,CAAC;QAClB,yCAAyC;QAEzC,gBAAW,GAAG,KAAK,CAAC;QACpB,8CAA8C;QAE9C,gBAAW,GAAG,KAAK,CAAC;IAuLtB,CAAC;IArLC,KAAK,CAAC,YAAY;QAChB,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC;IACpB,CAAC;IAEO,UAAU;QAChB,OAAO,IAAI,CAAA;;WAEJ,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAA,aAAa,IAAI,CAAC,IAAI,aAAa,CAAC,CAAC,CAAC,OAAO;;OAEjE,CAAC;IACN,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA,WAAW,IAAI,CAAC,KAAK,IAAI,OAAO;iBAC9B,IAAI,CAAC,UAAU,EAAE;gBAClB,IAAI,CAAC,KAAK,IAAI,OAAO,WAAW,CAAC;IAC/C,CAAC;;AAEM,iBAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkKlB,CAAC;AAlMF;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;yCACZ;AAGf;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;wCACb;AAGd;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;6CACV;AAGlB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;+CACR;AAGpB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;+CACR;AAfT,UAAU;IADtB,aAAa,CAAC,aAAa,CAAC;GAChB,UAAU,CAsMtB;SAtMY,UAAU","sourcesContent":["import {\n  css,\n  customElement,\n  html,\n  LitElement,\n  property,\n  TemplateResult,\n} from 'lit-element';\nimport { nothing } from 'lit-html';\n\nimport '@material/mwc-icon';\n\n/**\n * A responsive container rendering actions in a header.\n *\n * The \"action\" slot may contain up to eight icon buttons.\n * The \"icon\" slot, if filled overrides the icon property.\n * The default slot will be rendered into the pane body in a single column.\n */\n@customElement('action-icon')\nexport class ActionIcon extends LitElement {\n  /** caption text, displayed in the header */\n  @property({ type: String })\n  label?: string;\n  /** icon name, displayed unless the \"icon\" slot is filled */\n  @property({ type: String })\n  icon?: string;\n  /** color header with secondary theme color while focus is within */\n  @property({ type: Boolean })\n  secondary = false;\n  /** highlight pane with dotted outline */\n  @property({ type: Boolean })\n  highlighted = false;\n  /** disables CSS adoption to action buttons */\n  @property({ type: Boolean })\n  hideActions = false;\n\n  async firstUpdated(): Promise<void> {\n    this.tabIndex = 0;\n  }\n\n  private renderIcon(): TemplateResult {\n    return html`<span>\n      <slot name=\"icon\"\n        >${this.icon ? html`<mwc-icon>${this.icon}</mwc-icon>` : nothing}</slot\n      ></span\n    > `;\n  }\n\n  render(): TemplateResult {\n    return html`<header>${this.label ?? nothing}</header>\n      <section>${this.renderIcon()}<slot name=\"action\"></slot></section>\n      <footer>${this.label ?? nothing}</footer>`;\n  }\n\n  static styles = css`\n    :host {\n      display: flex;\n      flex-direction: column;\n      outline: none;\n    }\n\n    section {\n      align-self: center;\n    }\n\n    ::slotted([slot='icon']),\n    mwc-icon {\n      display: block;\n      color: var(--mdc-theme-on-surface);\n      transition: transform 150ms linear, box-shadow 200ms linear;\n      outline-color: var(--mdc-theme-primary);\n      outline-style: solid;\n      margin: 0px;\n      outline-width: 0px;\n      width: 64px;\n      height: 64px;\n      --mdc-icon-size: 64px;\n    }\n\n    :host([secondary]) ::slotted([slot='icon']),\n    :host([secondary]) mwc-icon {\n      outline-color: var(--mdc-theme-secondary);\n    }\n\n    :host([highlighted]) ::slotted([slot='icon']),\n    :host([highlighted]) mwc-icon {\n      outline-style: dotted;\n      outline-width: 2px;\n    }\n\n    :host(:focus-within) ::slotted([slot='icon']),\n    :host(:focus-within) mwc-icon {\n      outline-style: solid;\n      outline-width: 4px;\n    }\n\n    :host(:focus-within:not([hideActions])) ::slotted([slot='icon']),\n    :host(:focus-within:not([hideActions])) mwc-icon {\n      transform: scale(0.8);\n      transition: all 250ms linear;\n      box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14),\n        0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2);\n    }\n\n    ::slotted([slot='icon']:hover),\n    mwc-icon:hover {\n      outline-style: dashed;\n      outline-width: 2px;\n      transition: transform 200ms linear, box-shadow 250ms linear;\n    }\n\n    ::slotted([slot='action']) {\n      color: var(--mdc-theme-on-surface);\n      transition: transform 200ms cubic-bezier(0.4, 0, 0.2, 1),\n        opacity 200ms linear;\n      position: absolute;\n      pointer-events: none;\n      z-index: 1;\n      opacity: 0;\n      margin-top: -56px;\n      margin-left: 8px;\n    }\n\n    :host(:focus-within) ::slotted([slot='action']) {\n      transition: transform 250ms cubic-bezier(0.4, 0, 0.2, 1),\n        opacity 250ms linear;\n      pointer-events: auto;\n      opacity: 1;\n    }\n\n    :host(:focus-within) ::slotted([slot='action']:nth-of-type(1)) {\n      transform: translate(0px, -52px);\n    }\n    :host(:focus-within) ::slotted([slot='action']:nth-of-type(2)) {\n      transform: translate(0px, 52px);\n    }\n    :host(:focus-within) ::slotted([slot='action']:nth-of-type(3)) {\n      transform: translate(52px, 0px);\n    }\n    :host(:focus-within) ::slotted([slot='action']:nth-of-type(4)) {\n      transform: translate(-52px, 0px);\n    }\n    :host(:focus-within) ::slotted([slot='action']:nth-of-type(5)) {\n      transform: translate(52px, -52px);\n    }\n    :host(:focus-within) ::slotted([slot='action']:nth-of-type(6)) {\n      transform: translate(-52px, 52px);\n    }\n    :host(:focus-within) ::slotted([slot='action']:nth-of-type(7)) {\n      transform: translate(-52px, -52px);\n    }\n    :host(:focus-within) ::slotted([slot='action']:nth-of-type(8)) {\n      transform: translate(52px, 52px);\n    }\n\n    footer {\n      color: var(--mdc-theme-on-surface);\n      font-family: 'Roboto', sans-serif;\n      font-weight: 300;\n      overflow: hidden;\n      white-space: nowrap;\n      text-overflow: ellipsis;\n      margin: 0px;\n      text-align: center;\n      align-self: center;\n      max-width: 100%;\n      direction: rtl;\n    }\n\n    header {\n      color: var(--mdc-theme-on-primary);\n      background-color: var(--mdc-theme-primary);\n      font-family: 'Roboto', sans-serif;\n      font-weight: 500;\n      font-size: 1.2em;\n      position: absolute;\n      text-align: center;\n      align-self: center;\n      max-width: 100vw;\n      padding: 4px 8px;\n      border-radius: 4px;\n      opacity: 0;\n      transition: transform 200ms cubic-bezier(0.4, 0, 0.2, 1),\n        opacity 200ms linear;\n    }\n\n    :host([secondary]) header {\n      background-color: var(--mdc-theme-secondary);\n    }\n\n    :host(:hover) header {\n      position: absolute;\n      opacity: 1;\n      transform: translate(0, -40px);\n      box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14),\n        0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2);\n      transition: transform 250ms cubic-bezier(0.4, 0, 0.2, 1),\n        opacity 250ms linear;\n    }\n\n    :host(:focus-within) header {\n      position: absolute;\n      opacity: 1;\n      box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14),\n        0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2);\n      transition: transform 250ms cubic-bezier(0.4, 0, 0.2, 1),\n        opacity 250ms linear;\n    }\n\n    :host(:focus-within:not([hideActions])) header {\n      transform: translate(0, -80px);\n    }\n\n    :host(:focus-within[hideActions]) header {\n      transform: translate(0, -40px);\n    }\n  `;\n}\n"]}

package/dist/src/action-pane.d.ts

@@ -1,25 +0,0 @@
-import { LitElement, TemplateResult } from 'lit-element';
-import '@material/mwc-icon';
-/**
- * A responsive container rendering actions in a header.
- *
- * The "action" slot may contain up to eight icon buttons.
- * The "icon" slot, if filled overrides the icon property.
- * The default slot will be rendered into the pane body in a single column.
- */
-export declare class ActionPane extends LitElement {
-    /** caption text, displayed in the header */
-    label?: string;
-    /** icon name, displayed unless the "icon" slot is filled */
-    icon?: string;
-    /** color header with secondary theme color while focus is within */
-    secondary: boolean;
-    /** highlight pane with dotted outline */
-    highlighted: boolean;
-    /** nesting level, default (closest pane ancestor's level) + 1 */
-    level: number;
-    firstUpdated(): Promise<void>;
-    private renderHeader;
-    render(): TemplateResult;
-    static styles: import("lit-element").CSSResult;
-}

package/dist/src/action-pane.js

@@ -1,176 +0,0 @@
-import { __decorate } from "tslib";
-import { css, customElement, html, LitElement, property, } from 'lit-element';
-import { classMap } from 'lit-html/directives/class-map';
-import '@material/mwc-icon';
-import { nothing } from 'lit-html';
-function closestTo(node, selector) {
-    const closest = node.nodeType === Node.ELEMENT_NODE
-        ? node.closest(selector)
-        : null;
-    if (closest)
-        return closest;
-    const root = node.getRootNode();
-    if (root instanceof ShadowRoot)
-        return closestTo(root.host, selector);
-    return null;
-}
-/**
- * A responsive container rendering actions in a header.
- *
- * The "action" slot may contain up to eight icon buttons.
- * The "icon" slot, if filled overrides the icon property.
- * The default slot will be rendered into the pane body in a single column.
- */
-let ActionPane = class ActionPane extends LitElement {
-    constructor() {
-        super(...arguments);
-        /** color header with secondary theme color while focus is within */
-        this.secondary = false;
-        /** highlight pane with dotted outline */
-        this.highlighted = false;
-        /** nesting level, default (closest pane ancestor's level) + 1 */
-        this.level = 1;
-    }
-    async firstUpdated() {
-        this.tabIndex = 0;
-        const parentPane = closestTo(this.parentNode, 'action-pane');
-        if (parentPane)
-            this.level = parentPane.level + 1;
-        this.level = Math.floor(this.level);
-    }
-    renderHeader() {
-        const content = html `<span
-        ><slot name="icon"
-          >${this.icon
-            ? html `<mwc-icon>${this.icon}</mwc-icon>`
-            : nothing}</slot
-        ></span
-      >
-      ${this.label ?? nothing}
-      <nav><slot name="action"></slot></nav>`;
-        const headingLevel = Math.floor(Math.max(this.level, 1));
-        // Sometimes a TemplateResult is passed in as Label, not a string. So only when it's a string show a title.
-        const title = typeof this.label === 'string' ? this.label : '';
-        switch (headingLevel) {
-            case 1:
-                return html `<h1 title="${title}">${content}</h1>`;
-            case 2:
-                return html `<h2 title="${title}">${content}</h2>`;
-            case 3:
-                return html `<h3 title="${title}">${content}</h3>`;
-            default:
-                return html `<h4 title="${title}">${content}</h4>`;
-        }
-    }
-    render() {
-        return html `<section
-      class="${classMap({
-            secondary: this.secondary,
-            highlighted: this.highlighted,
-            contrasted: this.level % 2 === 0,
-        })}"
-    >
-      ${this.renderHeader()}
-      <div><slot></slot></div>
-    </section>`;
-    }
-};
-ActionPane.styles = css `
-    :host {
-      outline: none;
-    }
-
-    :host(:focus-within) section {
-      box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14),
-        0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2);
-      outline-width: 4px;
-      transition: all 250ms linear;
-    }
-
-    section {
-      background-color: var(--mdc-theme-surface);
-      transition: all 200ms linear;
-      outline-style: solid;
-      margin: 0px;
-      outline-width: 0px;
-      outline-color: var(--mdc-theme-primary);
-    }
-
-    section.secondary {
-      outline-color: var(--mdc-theme-secondary);
-    }
-
-    section > div {
-      display: flex;
-      flex-direction: column;
-      gap: 12px;
-      padding: 8px 12px 16px;
-      clear: right;
-    }
-
-    .highlighted {
-      outline-style: dotted;
-      outline-width: 2px;
-    }
-
-    :host(:focus-within) .highlighted {
-      outline-style: solid;
-    }
-
-    .contrasted {
-      background-color: var(--mdc-theme-on-primary);
-    }
-
-    h1,
-    h2,
-    h3,
-    h4 {
-      color: var(--mdc-theme-on-surface);
-      font-family: 'Roboto', sans-serif;
-      font-weight: 300;
-      overflow: clip visible;
-      white-space: nowrap;
-      text-overflow: ellipsis;
-      margin: 0px;
-      line-height: 52px;
-      padding-left: 0.3em;
-    }
-
-    nav {
-      float: right;
-    }
-
-    mwc-icon {
-      vertical-align: middle;
-      position: relative;
-      top: -0.1em;
-      --mdc-icon-size: 1em;
-    }
-
-    ::slotted([slot='icon']) {
-      vertical-align: middle;
-      position: relative;
-      top: -0.1em;
-      --mdc-icon-size: 1em;
-    }
-  `;
-__decorate([
-    property({ type: String })
-], ActionPane.prototype, "label", void 0);
-__decorate([
-    property({ type: String })
-], ActionPane.prototype, "icon", void 0);
-__decorate([
-    property({ type: Boolean })
-], ActionPane.prototype, "secondary", void 0);
-__decorate([
-    property({ type: Boolean })
-], ActionPane.prototype, "highlighted", void 0);
-__decorate([
-    property({ type: Number })
-], ActionPane.prototype, "level", void 0);
-ActionPane = __decorate([
-    customElement('action-pane')
-], ActionPane);
-export { ActionPane };
-//# sourceMappingURL=action-pane.js.map

package/dist/src/action-pane.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"action-pane.js","sourceRoot":"","sources":["../../src/action-pane.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n  css,\n  customElement,\n  html,\n  LitElement,\n  property,\n  TemplateResult,\n} from 'lit-element';\nimport { classMap } from 'lit-html/directives/class-map';\n\nimport '@material/mwc-icon';\nimport { nothing } from 'lit-html';\n\nfunction closestTo<E extends Element>(node: Node, selector: string): E | null {\n  const closest =\n    node.nodeType === Node.ELEMENT_NODE\n      ? (<Element>node).closest<E>(selector)\n      : null;\n\n  if (closest) return closest;\n\n  const root = <Document | DocumentFragment>node.getRootNode();\n\n  if (root instanceof ShadowRoot) return closestTo(root.host, selector);\n\n  return null;\n}\n\n/**\n * A responsive container rendering actions in a header.\n *\n * The \"action\" slot may contain up to eight icon buttons.\n * The \"icon\" slot, if filled overrides the icon property.\n * The default slot will be rendered into the pane body in a single column.\n */\n@customElement('action-pane')\nexport class ActionPane extends LitElement {\n  /** caption text, displayed in the header */\n  @property({ type: String })\n  label?: string;\n  /** icon name, displayed unless the \"icon\" slot is filled */\n  @property({ type: String })\n  icon?: string;\n  /** color header with secondary theme color while focus is within */\n  @property({ type: Boolean })\n  secondary = false;\n  /** highlight pane with dotted outline */\n  @property({ type: Boolean })\n  highlighted = false;\n  /** nesting level, default (closest pane ancestor's level) + 1 */\n  @property({ type: Number })\n  level = 1;\n\n  async firstUpdated(): Promise<void> {\n    this.tabIndex = 0;\n\n    const parentPane = closestTo<ActionPane>(this.parentNode!, 'action-pane');\n    if (parentPane) this.level = parentPane.level + 1;\n\n    this.level = Math.floor(this.level);\n  }\n\n  private renderHeader(): TemplateResult {\n    const content = html`<span\n        ><slot name=\"icon\"\n          >${this.icon\n            ? html`<mwc-icon>${this.icon}</mwc-icon>`\n            : nothing}</slot\n        ></span\n      >\n      ${this.label ?? nothing}\n      <nav><slot name=\"action\"></slot></nav>`;\n\n    const headingLevel = Math.floor(Math.max(this.level, 1));\n    // Sometimes a TemplateResult is passed in as Label, not a string. So only when it's a string show a title.\n    const title = typeof this.label === 'string' ? this.label : '';\n    switch (headingLevel) {\n      case 1:\n        return html`<h1 title=\"${title}\">${content}</h1>`;\n      case 2:\n        return html`<h2 title=\"${title}\">${content}</h2>`;\n      case 3:\n        return html`<h3 title=\"${title}\">${content}</h3>`;\n      default:\n        return html`<h4 title=\"${title}\">${content}</h4>`;\n    }\n  }\n\n  render(): TemplateResult {\n    return html`<section\n      class=\"${classMap({\n        secondary: this.secondary,\n        highlighted: this.highlighted,\n        contrasted: this.level % 2 === 0,\n      })}\"\n    >\n      ${this.renderHeader()}\n      <div><slot></slot></div>\n    </section>`;\n  }\n\n  static styles = css`\n    :host {\n      outline: none;\n    }\n\n    :host(:focus-within) section {\n      box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14),\n        0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2);\n      outline-width: 4px;\n      transition: all 250ms linear;\n    }\n\n    section {\n      background-color: var(--mdc-theme-surface);\n      transition: all 200ms linear;\n      outline-style: solid;\n      margin: 0px;\n      outline-width: 0px;\n      outline-color: var(--mdc-theme-primary);\n    }\n\n    section.secondary {\n      outline-color: var(--mdc-theme-secondary);\n    }\n\n    section > div {\n      display: flex;\n      flex-direction: column;\n      gap: 12px;\n      padding: 8px 12px 16px;\n      clear: right;\n    }\n\n    .highlighted {\n      outline-style: dotted;\n      outline-width: 2px;\n    }\n\n    :host(:focus-within) .highlighted {\n      outline-style: solid;\n    }\n\n    .contrasted {\n      background-color: var(--mdc-theme-on-primary);\n    }\n\n    h1,\n    h2,\n    h3,\n    h4 {\n      color: var(--mdc-theme-on-surface);\n      font-family: 'Roboto', sans-serif;\n      font-weight: 300;\n      overflow: clip visible;\n      white-space: nowrap;\n      text-overflow: ellipsis;\n      margin: 0px;\n      line-height: 52px;\n      padding-left: 0.3em;\n    }\n\n    nav {\n      float: right;\n    }\n\n    mwc-icon {\n      vertical-align: middle;\n      position: relative;\n      top: -0.1em;\n      --mdc-icon-size: 1em;\n    }\n\n    ::slotted([slot='icon']) {\n      vertical-align: middle;\n      position: relative;\n      top: -0.1em;\n      --mdc-icon-size: 1em;\n    }\n  `;\n}\n"]}

package/dist/src/addons/Editor.d.ts

@@ -1,25 +0,0 @@
-import { EditEventV2, OpenEvent, XMLEditor } from '@openscd/core';
-import { LitElement, TemplateResult } from 'lit-element';
-import { EditEvent } from '@openscd/core';
-export declare class OscdEditor extends LitElement {
-    /** The `XMLDocument` to be edited */
-    doc: XMLDocument | null;
-    /** The name of the current [[`doc`]] */
-    docName: string;
-    /** The UUID of the current [[`doc`]] */
-    docId: string;
-    /** XML Editor to apply changes to the scd */
-    editor: XMLEditor;
-    host: HTMLElement;
-    private onAction;
-    handleEditEvent(event: EditEvent): void;
-    /**
-     *
-     * @deprecated [Move to handleOpenDoc instead]
-     */
-    private onOpenDoc;
-    handleOpenDoc({ detail: { docName, doc } }: OpenEvent): void;
-    connectedCallback(): void;
-    render(): TemplateResult;
-    handleEditEventV2(event: EditEventV2): Promise<void>;
-}