Merge pull request #177 from com-pas/upstream-v0.21.0

Merge version v0.21.0 from OpenSCD

Author: juancho0202

CHANGELOG.md

@@ -2,6 +2,20 @@
 
 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.21.0](https://github.com/openscd/open-scd/compare/v0.20.0...v0.21.0) (2022-08-08)
+
+
+### Features
+
+* **editors/publisher:** add read only gse-control-element-editor ([#917](https://github.com/openscd/open-scd/issues/917)) ([2aee3cc](https://github.com/openscd/open-scd/commits/2aee3ccb78cbe1c18a2b55769b130e196bc45869))
+* **editors/publisher:** add sampled-value-control-element-editor ([#920](https://github.com/openscd/open-scd/issues/920)) ([e95dfc5](https://github.com/openscd/open-scd/commits/e95dfc509b710dafc53f2980f5ac93e303cc995d))
+* **plugin:** add read-only report-control-element-editor ([#913](https://github.com/openscd/open-scd/issues/913)) ([21732c9](https://github.com/openscd/open-scd/commits/21732c984c5af0e1a31424f3485cb98ccaa70f6a))
+
+
+### Bug Fixes
+
+* **editors/cleanup:** Fix filter issue with in cleanup plugin ([#910](https://github.com/openscd/open-scd/issues/910)) ([92e7390](https://github.com/openscd/open-scd/commits/92e7390a9cfb42d25858578b71bf935304cc4691))
+
 ## [0.20.0](https://github.com/openscd/open-scd/compare/v0.19.0...v0.20.0) (2022-07-31)
 
 

manifest.json

@@ -40,5 +40,5 @@
       "purpose": "maskable"
     }
   ],
-  "version": "0.20.0"
+  "version": "0.21.0"
 }

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "open-scd",
-  "version": "0.20.0",
+  "version": "0.21.0",
   "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": [

package.json

@@ -21,6 +21,7 @@ export default class PublisherPlugin extends LitElement {
   /** The document being edited as provided to plugins by [[`OpenSCD`]]. */
   @property({ attribute: false })
   doc!: XMLDocument;
+
   @state()
   private publisherType: 'Report' | 'GOOSE' | 'SampledValue' | 'DataSet' =
     'GOOSE';

src/editors/Publisher.ts

@@ -10,6 +10,7 @@ import {
   query,
   queryAll,
 } from 'lit-element';
+import { classMap } from 'lit-html/directives/class-map';
 import { translate } from 'lit-translate';
 
 import '@material/mwc-button';
@@ -76,7 +77,7 @@ function getCommAddress(controlBlock: Element): Element | null | undefined {
 @customElement('cleanup-control-blocks')
 export class CleanupControlBlocks extends LitElement {
   /** The document being edited as provided to plugins by [[`OpenSCD`]]. */
-  @property()
+  @property({ attribute: false })
   doc!: XMLDocument;
 
   @property({ type: Boolean })
@@ -85,7 +86,7 @@ export class CleanupControlBlocks extends LitElement {
   @property({ type: Array })
   unreferencedControls: Element[] = [];
 
-  @property()
+  @property({ attribute: false })
   selectedControlItems: MWCListIndex | [] = [];
 
   @query('.deleteButton')
@@ -118,7 +119,9 @@ export class CleanupControlBlocks extends LitElement {
    */
   private toggleHiddenClass(selectorType: string) {
     this.cleanupList!.querySelectorAll(`.${selectorType}`).forEach(element => {
-      element.classList.toggle('hidden');
+      element.classList.toggle('hiddenontypefilter');
+      if (element.hasAttribute('disabled')) element.removeAttribute('disabled');
+      else element.setAttribute('disabled', 'true');
     });
   }
 
@@ -164,7 +167,13 @@ export class CleanupControlBlocks extends LitElement {
   private renderListItem(controlBlock: Element): TemplateResult {
     return html`<mwc-check-list-item
       twoline
-      class="cleanupListItem t${controlBlock.tagName}"
+      class="${classMap({
+        cleanupListItem: true,
+        tReportControl: controlBlock.tagName === 'ReportControl',
+        tLogControl: controlBlock.tagName === 'LogControl',
+        tGSEControl: controlBlock.tagName === 'GSEControl',
+        tSampledValueControl: controlBlock.tagName === 'SampledValueControl',
+      })}"
       value="${identity(controlBlock)}"
       graphic="large"
       ><span class="unreferencedControl"
@@ -228,13 +237,15 @@ export class CleanupControlBlocks extends LitElement {
    * @returns html for the Delete Button of this container.
    */
   private renderDeleteButton(): TemplateResult {
+    const sizeSelectedItems = (<Set<number>>this.selectedControlItems).size;
+
     return html`<mwc-button
       outlined
       icon="delete"
       class="deleteButton"
-      label="${translate('cleanup.unreferencedControls.deleteButton')} (${(<
-        Set<number>
-      >this.selectedControlItems).size || '0'})"
+      label="${translate(
+        'cleanup.unreferencedControls.deleteButton'
+      )} (${sizeSelectedItems || '0'})"
       ?disabled=${(<Set<number>>this.selectedControlItems).size === 0 ||
       (Array.isArray(this.selectedControlItems) &&
         !this.selectedControlItems.length)}
@@ -399,22 +410,12 @@ export class CleanupControlBlocks extends LitElement {
       opacity: 1;
     }
 
-    /* items are disabled if the filter is deselected */
-    .tGSEControl,
-    .tSampledValueControl,
-    .tLogControl,
-    .tReportControl {
+    /* Make sure to type filter here
+    .hidden is set on string filter in filtered-list and must always filter*/
+    .cleanupListItem.hiddenontypefilter:not(.hidden) {
       display: none;
     }
 
-    /* items enabled if filter is selected */
-    .tGSEControlFilter[on] ~ .cleanupList > .tGSEControl,
-    .tSampledValueControlFilter[on] ~ .cleanupList > .tSampledValueControl,
-    .tLogControlFilter[on] ~ .cleanupList > .tLogControl,
-    .tReportControlFilter[on] ~ .cleanupList > .tReportControl {
-      display: flex;
-    }
-
     /* filter disabled, Material Design guidelines for opacity */
     .tGSEControlFilter,
     .tSampledValueControlFilter,

src/editors/cleanup/control-blocks-container.ts

@@ -38,7 +38,7 @@ import { cleanSCLItems, identitySort } from './foundation.js';
 @customElement('cleanup-datasets')
 export class CleanupDatasets extends LitElement {
   /** The document being edited as provided to plugins by [[`OpenSCD`]]. */
-  @property()
+  @property({ attribute: false })
   doc!: XMLDocument;
 
   @property({ type: Boolean })
@@ -47,7 +47,7 @@ export class CleanupDatasets extends LitElement {
   @property({ type: Array })
   unreferencedDataSets: Element[] = [];
 
-  @property()
+  @property({ attribute: false })
   selectedDatasetItems: MWCListIndex | [] = [];
 
   @query('.deleteButton')
@@ -107,13 +107,15 @@ export class CleanupDatasets extends LitElement {
    * @returns html for the Delete Button of this container.
    */
   private renderDeleteButton(): TemplateResult {
+    const sizeSelectedItems = (<Set<number>>this.selectedDatasetItems).size;
+
     return html` <mwc-button
       outlined
       icon="delete"
       class="deleteButton cleanupDeleteButton"
-      label="${translate('cleanup.unreferencedDataSets.deleteButton')} (${(<
-        Set<number>
-      >this.selectedDatasetItems).size || '0'})"
+      label="${translate(
+        'cleanup.unreferencedDataSets.deleteButton'
+      )} (${sizeSelectedItems || '0'})"
       ?disabled=${(<Set<number>>this.selectedDatasetItems).size === 0 ||
       (Array.isArray(this.selectedDatasetItems) &&
         !this.selectedDatasetItems.length)}

src/editors/cleanup/datasets-container.ts

@@ -26,7 +26,21 @@ import { styles } from './foundation.js';
 export class DataSetEditor extends LitElement {
   /** The document being edited as provided to plugins by [[`OpenSCD`]]. */
   @property({ attribute: false })
-  doc!: XMLDocument;
+  set doc(newDoc: XMLDocument) {
+    if (this._doc === newDoc) return;
+
+    this.selectedDataSet = undefined;
+    if (this.selectionList && this.selectionList.selected)
+      (this.selectionList.selected as ListItem).selected = false;
+
+    this._doc = newDoc;
+
+    this.requestUpdate();
+  }
+  get doc(): XMLDocument {
+    return this._doc;
+  }
+  private _doc!: XMLDocument;
 
   @state()
   selectedDataSet?: Element;
@@ -113,5 +127,9 @@ export class DataSetEditor extends LitElement {
 
   static styles = css`
     ${styles}
+
+    data-set-element-editor {
+      flex: auto;
+    }
   `;
 }

src/editors/publisher/data-set-editor.ts

@@ -18,6 +18,10 @@ import { identity } from '../../foundation.js';
 
 @customElement('data-set-element-editor')
 export class DataSetElementEditor extends LitElement {
+  /** The document being edited as provided to plugins by [[`OpenSCD`]]. */
+  @property({ attribute: false })
+  doc!: XMLDocument;
+  /** The element being edited as provided to plugins by [[`OpenSCD`]]. */
   @property({ attribute: false })
   element!: Element | null;
 
@@ -30,53 +34,61 @@ export class DataSetElementEditor extends LitElement {
     return this.element ? this.element.getAttribute('desc') : 'UNDEFINED';
   }
 
+  private renderContent(): TemplateResult {
+    return html`<wizard-textfield
+        label="name"
+        .maybeValue=${this.name}
+        helper="${translate('scl.name')}"
+        required
+      >
+      </wizard-textfield>
+      <wizard-textfield
+        label="desc"
+        .maybeValue=${this.desc}
+        helper="${translate('scl.desc')}"
+        nullable
+      >
+      </wizard-textfield>
+      <filtered-list
+        >${Array.from(this.element!.querySelectorAll('FCDA')).map(fcda => {
+          const [ldInst, prefix, lnClass, lnInst, doName, daName, fc] = [
+            'ldInst',
+            'prefix',
+            'lnClass',
+            'lnInst',
+            'doName',
+            'daName',
+            'fc',
+          ].map(attributeName => fcda.getAttribute(attributeName) ?? '');
+
+          return html`<mwc-list-item selected twoline value="${identity(fcda)}"
+            ><span
+              >${doName}${daName
+                ? '.' + daName + ' ' + '[' + fc + ']'
+                : ' ' + '[' + fc + ']'}</span
+            ><span slot="secondary"
+              >${ldInst + '/' + prefix + lnClass + lnInst}</span
+            >
+          </mwc-list-item>`;
+        })}</filtered-list
+      >`;
+  }
+
   render(): TemplateResult {
     if (this.element)
       return html`<div class="content">
         <h2>
           <div>DataSet</div>
           <div class="headersubtitle">${identity(this.element)}</div>
         </h2>
-        <wizard-textfield
-          label="name"
-          .maybeValue=${this.name}
-          helper="${translate('scl.name')}"
-          required
-        >
-        </wizard-textfield>
-        <wizard-textfield
-          label="desc"
-          .maybeValue=${this.desc}
-          helper="${translate('scl.desc')}"
-          nullable
-        >
-        </wizard-textfield>
-        <filtered-list
-          >${Array.from(this.element.querySelectorAll('FCDA')).map(fcda => {
-            const [ldInst, prefix, lnClass, lnInst, doName, daName] = [
-              'ldInst',
-              'prefix',
-              'lnClass',
-              'lnInst',
-              'doName',
-              'daName',
-            ].map(attributeName => fcda.getAttribute(attributeName) ?? '');
-
-            return html`<mwc-list-item
-              selected
-              twoline
-              value="${identity(fcda)}"
-              ><span>${doName + '.' + daName}</span
-              ><span slot="secondary"
-                >${ldInst + '/' + prefix + lnClass + lnInst}</span
-              >
-            </mwc-list-item>`;
-          })}</filtered-list
-        >
+        ${this.renderContent()}
       </div>`;
 
     return html`<div class="content">
-      <h2>${translate('publisher.nodataset')}</h2>
+      <h2>
+        <div>DataSet</div>
+        <div class="headersubtitle">${translate('publisher.nodataset')}</div>
+      </h2>
     </div>`;
   }
 

src/editors/publisher/data-set-element-editor.ts

@@ -21,10 +21,6 @@ export const styles = css`
     display: flex;
   }
 
-  data-set-element-editor {
-    width: calc(100% - 6px);
-  }
-
   .listitem.header {
     font-weight: 500;
   }
@@ -37,6 +33,12 @@ export const styles = css`
     display: none;
   }
 
+  @media (max-width: 950px) {
+    .elementeditorcontainer {
+      display: block;
+    }
+  }
+
   @media (max-width: 599px) {
     .content {
       height: 100%;
@@ -54,6 +56,10 @@ export const styles = css`
         0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2);
     }
 
+    .elementeditorcontainer {
+      display: block;
+    }
+
     data-set-element-editor {
       width: calc(100% - 16px);
     }