Merge

Signed-off-by: Flurb <[email protected]>

Author: Flurb

CHANGELOG.md

@@ -2,6 +2,33 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+### [0.8.2](https://github.com/openscd/open-scd/compare/v0.8.1...v0.8.2) (2022-01-15)
+
+
+### Bug Fixes
+
+* **Help:** hot-fix incorrect import statement ([c3baa84](https://github.com/openscd/open-scd/commits/c3baa847e1446bf4f2d3b2ad74834228dfc96d08))
+
+### [0.8.1](https://github.com/openscd/open-scd/compare/v0.8.0...v0.8.1) (2022-01-15)
+
+
+### Features
+
+* **editors/ied:** add read only data model structure ([#423](https://github.com/openscd/open-scd/issues/423)) ([fa15c7a](https://github.com/openscd/open-scd/commits/fa15c7a598f92c2af7237c3e9e1060d453b2162d)), closes [#454](https://github.com/openscd/open-scd/issues/454)
+* **editors/ied:** Add toggle for LDevice child elements ([#484](https://github.com/openscd/open-scd/issues/484)) ([9385506](https://github.com/openscd/open-scd/commits/9385506d3f5356bf0523eb3678c13d6b38c17ba9))
+* **editors/ied:** Changed icon of IED Editor ([#481](https://github.com/openscd/open-scd/issues/481)) ([be4c8ca](https://github.com/openscd/open-scd/commits/be4c8ca60e6817739094a92a77ef82c1c3911f2c))
+* **editors/SingleLineDiagram:** allow selecting the Substation element ([#449](https://github.com/openscd/open-scd/issues/449)) ([d09efec](https://github.com/openscd/open-scd/commits/d09efec1eccdf2363ed1db22c2558b9cc25b9395))
+* **editors/SingleLineDiagram:** allow updating X/Y coordinates in SLD for Busbar/ConductingEquipment/PowerTransformer ([#455](https://github.com/openscd/open-scd/issues/455)) ([dfae9b0](https://github.com/openscd/open-scd/commits/dfae9b0deda74cd12785b0a55a9298e91ec21b01))
+* **foundation:** allow dynamic wizards ([#471](https://github.com/openscd/open-scd/issues/471)) ([64a27d5](https://github.com/openscd/open-scd/commits/64a27d5875d2362b1796e811f909e13af7995c33))
+* **UpdateDescriptionSEL:** add menu type plugin for SEL specific IEDs ([#424](https://github.com/openscd/open-scd/issues/424)) ([12c9123](https://github.com/openscd/open-scd/commits/12c912301f8a918f27ef55b702a0334f76e96a45))
+* **zeroline:** show SampledValueControl for IED and whole project ([#477](https://github.com/openscd/open-scd/issues/477)) ([0253adc](https://github.com/openscd/open-scd/commits/0253adc3d696cd806eff23534114c122d27bb979))
+
+
+### Bug Fixes
+
+* **editors/template/lnodetype:** fix incorrect pattern for lnClass ([#469](https://github.com/openscd/open-scd/issues/469)) ([55e0c7e](https://github.com/openscd/open-scd/commits/55e0c7e999536bbd58b574be1ab93237974dfb87))
+* **wizards/fcda:** remove incorrect iedName from FCDA ([#446](https://github.com/openscd/open-scd/issues/446)) ([eae9f6e](https://github.com/openscd/open-scd/commits/eae9f6edc313bf293caa31ed3f82d5261a9ef5f3))
+
 ## [0.8.0](https://github.com/openscd/open-scd/compare/v0.7.1...v0.8.0) (2021-12-10)
 
 

manifest.json

@@ -40,5 +40,5 @@
       "purpose": "maskable"
     }
   ],
-  "version": "0.8.0"
+  "version": "0.8.2"
 }

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "open-scd",
-  "version": "0.8.0",
+  "version": "0.8.2",
   "repository": "https://github.com/openscd/open-scd.git",
   "description": "A bottom-up substation configuration designer for projects described using SCL `IEC 61850-6` Edition 2 or greater.",
   "keywords": [
@@ -40,7 +40,7 @@
     "lit-element": "2.5.1",
     "lit-html": "1.4.1",
     "lit-translate": "^1.2.1",
-    "marked": "^3.0.0",
+    "marked": "^4.0.10",
     "panzoom": "^9.4.2"
   },
   "scripts": {

package.json

@@ -6,6 +6,13 @@ export const officialPlugins = [
     default: true,
     kind: 'editor',
   },
+  {
+    name: 'IED',
+    src: '/src/editors/IED.js',
+    icon: 'developer_board',
+    default: false,
+    kind: 'editor',
+  },
   {
     name: 'Single Line Diagram',
     src: '/src/editors/SingleLineDiagram.js',
@@ -109,6 +116,14 @@ export const officialPlugins = [
     requireDoc: true,
     position: 'middle'
   },
+  {
+    name: 'Update desc (SEL)',
+    src: '/src/menu/UpdateDescriptionSEL.js',
+    default: false,
+    kind: 'menu',
+    requireDoc: true,
+    position: 'middle'
+  },
   {
     name: 'Merge Project',
     src: '/src/menu/CompasMerge.js',

public/js/plugins.js

@@ -3,8 +3,8 @@ import {
   ifImplemented,
   LitElementConstructor,
   Mixin,
-  Wizard,
   WizardEvent,
+  WizardFactory,
 } from './foundation.js';
 
 import './wizard-dialog.js';
@@ -18,13 +18,12 @@ export function Wizarding<TBase extends LitElementConstructor>(Base: TBase) {
   class WizardingElement extends Base {
     /** FIFO queue of [[`Wizard`]]s to display. */
     @internalProperty()
-    workflow: Wizard[] = [];
+    workflow: WizardFactory[] = [];
 
     @query('wizard-dialog') wizardUI!: WizardDialog;
 
     private onWizard(we: WizardEvent) {
       const wizard = we.detail.wizard;
-      if (wizard?.length === 0) return;
       if (wizard === null) this.workflow.shift();
       else if (we.detail.subwizard) this.workflow.unshift(wizard);
       else this.workflow.push(wizard);
@@ -49,7 +48,7 @@ export function Wizarding<TBase extends LitElementConstructor>(Base: TBase) {
 
     render(): TemplateResult {
       return html`${ifImplemented(super.render())}
-        <wizard-dialog .wizard=${this.workflow[0] ?? []}></wizard-dialog>`;
+        <wizard-dialog .wizard=${this.workflow[0]?.() ?? []}></wizard-dialog>`;
     }
   }
 

src/Wizarding.ts

@@ -0,0 +1,201 @@
+import {
+  css,
+  customElement,
+  html,
+  LitElement,
+  property,
+  TemplateResult,
+} 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.
+ */
+@customElement('action-icon')
+export class ActionIcon extends LitElement {
+  /** caption text, displayed in the header */
+  @property({ type: String })
+  label?: string;
+  /** icon name, displayed unless the "icon" slot is filled */
+  @property({ type: String })
+  icon?: string;
+  /** color header with secondary theme color while focus is within */
+  @property({ type: Boolean })
+  secondary = false;
+  /** highlight pane with dotted outline */
+  @property({ type: Boolean })
+  highlighted = false;
+
+  async firstUpdated(): Promise<void> {
+    this.tabIndex = 0;
+  }
+
+  private renderIcon(): TemplateResult {
+    return html`<span>
+      <slot name="icon"
+        >${this.icon ? html`<mwc-icon>${this.icon}</mwc-icon>` : nothing}</slot
+      ></span
+    > `;
+  }
+
+  render(): TemplateResult {
+    return html`<header>${this.label ?? nothing}</header>
+      <section>${this.renderIcon()}<slot name="action"></slot></section>
+      <footer>${this.label ?? nothing}</footer>`;
+  }
+
+  static 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(:focus-within) ::slotted([slot='icon']),
+    :host(:focus-within) mwc-icon {
+      outline-style: solid;
+      outline-width: 4px;
+      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);
+    }
+
+    :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;
+    }
+
+    ::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(: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;
+      transform: translate(0, -80px);
+      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;
+    }
+  `;
+}