diff --git a/package-lock.json b/package-lock.json index ee1d637a48..29205efb0b 100644 --- a/package-lock.json +++ b/package-lock.json @@ -32677,6 +32677,8 @@ "version": "0.34.0", "license": "Apache-2.0", "dependencies": { + "@compas-oscd/core": "^0.1.23", + "@compas-oscd/xml": "^0.0.1", "@material/mwc-dialog": "0.22.1", "@material/mwc-drawer": "0.22.1", "@material/mwc-fab": "0.22.1", @@ -32695,9 +32697,7 @@ "@material/mwc-textarea": "0.22.1", "@material/mwc-textfield": "0.22.1", "@material/mwc-top-app-bar-fixed": "0.22.1", - "@openscd/core": "npm:@compas-oscd/core@*", "@openscd/oscd-api": "^0.1.5", - "@openscd/xml": "npm:@compas-oscd/xml@*", "ace-custom-element": "^1.6.5", "lit": "^2.2.7", "lit-translate": "^1.2.1", diff --git a/packages/distribution/main.ts b/packages/distribution/main.ts index fe7e442d65..960ae9dfd4 100644 --- a/packages/distribution/main.ts +++ b/packages/distribution/main.ts @@ -1 +1 @@ -import '@openscd/open-scd/src/open-scd.js'; +import '@openscd/open-scd/src/open-scd.component.js'; diff --git a/packages/openscd/package.json b/packages/openscd/package.json index 6e05d062b9..3773bb565f 100644 --- a/packages/openscd/package.json +++ b/packages/openscd/package.json @@ -1,6 +1,6 @@ { "name": "@compas-oscd/open-scd", - "version": "0.34.0", + "version": "0.34.43", "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.", @@ -18,9 +18,36 @@ "module": "open-scd.js", "type": "module", "files": [ - "./build/**" + "./dist/**" ], + "exports": { + ".": "./dist/index.js", + "./dist/plugin.js": "./dist/plugin.js", + "./dist/plugin-tag.js": "./dist/plugin-tag.js", + "./dist/foundation/nsdoc.js": "./dist/foundation/nsdoc.js", + "./dist/plugin.events.js": "./dist/plugin.events.js", + "./dist/foundation.js": "./dist/foundation.js", + "./dist/schemas.js": "./dist/schemas.js", + "./addons/Waiter.js": "./dist/addons/Waiter.js", + "./addons/Settings.js": "./dist/addons/Settings.js", + "./dist/addons/Layout.js": "./dist/addons/Layout.js", + "./dist/addons/History.js": "./dist/addons/History.js", + "./addons/Editor.js": "./dist/addons/Editor.js", + "./addons/Wizards.js": "./dist/addons/Wizards.js", + "./dist/action-pane.js": "./dist/action-pane.js", + "./dist/action-icon.js": "./dist/action-icon.js", + "./dist/plain-compare-list.js": "./dist/plain-compare-list.js", + "./filtered-list.js": "./dist/filtered-list.js", + "./dist/wizard-textfield.js": "./dist/wizard-textfield.js", + "./dist/wizard-checkbox.js": "./dist/wizard-checkbox.js", + "./dist/wizard-select.js": "./dist/wizard-select.js", + "./dist/WizardDivider.js": "./dist/WizardDivider.js", + "./dist/oscd-filter-button.js": "./dist/oscd-filter-button.js", + "TODO:": "Open scd base class and web component" + }, "dependencies": { + "@compas-oscd/core": "^0.1.23", + "@compas-oscd/xml": "^0.0.1", "@material/mwc-dialog": "0.22.1", "@material/mwc-drawer": "0.22.1", "@material/mwc-fab": "0.22.1", @@ -40,8 +67,6 @@ "@material/mwc-textfield": "0.22.1", "@material/mwc-top-app-bar-fixed": "0.22.1", "@openscd/oscd-api": "^0.1.5", - "@openscd/core": "npm:@compas-oscd/core@*", - "@openscd/xml": "npm:@compas-oscd/xml@*", "ace-custom-element": "^1.6.5", "lit": "^2.2.7", "lit-translate": "^1.2.1", diff --git a/packages/openscd/src/Wizarding.ts b/packages/openscd/src/Wizarding.ts deleted file mode 100644 index 018876114b..0000000000 --- a/packages/openscd/src/Wizarding.ts +++ /dev/null @@ -1,56 +0,0 @@ -import { html, state, TemplateResult, query } from 'lit-element'; -import { - ifImplemented, - LitElementConstructor, - Mixin, - WizardEvent, - 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; - -export function Wizarding(Base: TBase) { - class WizardingElement extends Base { - /** FIFO queue of [[`Wizard`]]s to display. */ - @state() - workflow: WizardFactory[] = []; - - @query('wizard-dialog') wizardUI!: WizardDialog; - - private onWizard(we: WizardEvent) { - 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: any[]) { - super(...args); - - this.addEventListener('wizard', this.onWizard); - this.addEventListener('editor-action', () => - this.wizardUI.requestUpdate() - ); - } - - render(): TemplateResult { - return html`${ifImplemented(super.render())} - `; - } - } - - return WizardingElement; -} diff --git a/packages/openscd/src/action-pane.ts b/packages/openscd/src/action-pane.ts index 2102b899a7..3b3faf7c86 100644 --- a/packages/openscd/src/action-pane.ts +++ b/packages/openscd/src/action-pane.ts @@ -6,7 +6,7 @@ import { property, TemplateResult, } from 'lit-element'; -import { classMap } from 'lit-html/directives/class-map'; +import { classMap } from 'lit-html/directives/class-map.js'; import '@material/mwc-icon'; import { nothing } from 'lit-html'; diff --git a/packages/openscd/src/addons/Editor.ts b/packages/openscd/src/addons/Editor.ts index d385bbc580..99b611e34d 100644 --- a/packages/openscd/src/addons/Editor.ts +++ b/packages/openscd/src/addons/Editor.ts @@ -4,7 +4,7 @@ import { newEditEvent, newEditEventV2, XMLEditor -} from '@openscd/core'; +} from '@compas-oscd/core'; import { property, LitElement, @@ -17,11 +17,11 @@ import { get } from 'lit-translate'; import { EditorAction, EditorActionEvent, -} from '@openscd/core/foundation/deprecated/editor.js'; +} from '@compas-oscd/core'; -import { newLogEvent } from '@openscd/core/foundation/deprecated/history.js'; -import { newValidateEvent } from '@openscd/core/foundation/deprecated/validation.js'; -import { OpenDocEvent } from '@openscd/core/foundation/deprecated/open-event.js'; +import { newLogEvent } from '@compas-oscd/core'; +import { newValidateEvent } from '@compas-oscd/core'; +import { OpenDocEvent } from '@compas-oscd/core'; import { Edit, @@ -30,7 +30,7 @@ import { isInsert, isRemove, isUpdate, -} from '@openscd/core'; +} from '@compas-oscd/core'; import { convertEditActiontoV1 } from './editor/edit-action-to-v1-converter.js'; import { convertEditV1toV2 } from './editor/edit-v1-to-v2-converter.js'; diff --git a/packages/openscd/src/addons/History.ts b/packages/openscd/src/addons/History.ts index e1072fe1a4..3a1de0bef1 100644 --- a/packages/openscd/src/addons/History.ts +++ b/packages/openscd/src/addons/History.ts @@ -31,12 +31,12 @@ import { LogEntry, LogEntryType, LogEvent, -} from '@openscd/core/foundation/deprecated/history.js'; +} from '@compas-oscd/core'; import { getFilterIcon, iconColors } from '../icons/icons.js'; import { Plugin } from '../plugin.js'; -import { XMLEditor } from '@openscd/core'; +import { XMLEditor } from '@compas-oscd/core'; import { getLogText } from './history/get-log-text.js'; @@ -366,7 +366,7 @@ export class OscdHistory extends LitElement { `; } - private renderIssueEntry(issue: IssueDetail): TemplateResult { + protected renderIssueEntry(issue: IssueDetail): TemplateResult { return html` ${issue.title} diff --git a/packages/openscd/src/addons/Layout.ts b/packages/openscd/src/addons/Layout.ts index 58ad60aeed..3b31bced4c 100644 --- a/packages/openscd/src/addons/Layout.ts +++ b/packages/openscd/src/addons/Layout.ts @@ -9,18 +9,22 @@ import { css, } from 'lit-element'; import { get } from 'lit-translate'; -import { newPendingStateEvent } from '@openscd/core/foundation/deprecated/waiter.js'; -import { newSettingsUIEvent } from '@openscd/core/foundation/deprecated/settings.js'; -import { XMLEditor } from '@openscd/core'; +import { classMap } from 'lit-html/directives/class-map.js'; +import { newPendingStateEvent } from '@compas-oscd/core'; +import { newSettingsUIEvent } from '@compas-oscd/core'; +import { XMLEditor, OscdApi } from '@compas-oscd/core'; import { MenuItem, Validator, MenuPlugin, pluginIcons, + OpenSCD } from '../open-scd.js'; import { Plugin, + ContentContext, + PluginKind } from "../plugin.js" import { @@ -48,6 +52,51 @@ import "./plugin-manager/custom-plugin-dialog.js"; import "./menu-tabs/menu-tabs.js"; import { TabActivatedEvent } from "./menu-tabs/menu-tabs.js"; +/** + * This is a template literal tag function. See: + * https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals#tagged_templates + * + * Passes its arguments to LitElement's `html` tag after combining the first and + * last expressions with the first two and last two static strings. + * Throws unless the first and last expressions are identical strings. + * + * We need this to get around the expression location limitations documented in + * https://lit.dev/docs/templates/expressions/#expression-locations + * + * After upgrading to Lit 2 we can use their static HTML functions instead: + * https://lit.dev/docs/api/static-html/ + */ +function staticTagHtml( + oldStrings: ReadonlyArray, + ...oldArgs: unknown[] +): TemplateResult { + const args = [...oldArgs]; + const firstArg = args.shift(); + const lastArg = args.pop(); + + if (firstArg !== lastArg) + throw new Error( + `Opening tag <${firstArg}> does not match closing tag .` + ); + + const strings = [...oldStrings] as string[] & { raw: string[] }; + const firstString = strings.shift(); + const secondString = strings.shift(); + + const lastString = strings.pop(); + const penultimateString = strings.pop(); + + strings.unshift(`${firstString}${firstArg}${secondString}`); + strings.push(`${penultimateString}${lastArg}${lastString}`); + + return html(strings, ...args); +} + +interface RenderAblePlugin { + src?: string; + kind: string; + content?: ContentContext; +} @customElement('oscd-layout') export class OscdLayout extends LitElement { @@ -66,7 +115,7 @@ export class OscdLayout extends LitElement { @property({ type: Array }) plugins: Plugin[] = []; /** The open-scd host element */ - @property({ type: Object }) host!: HTMLElement; + @property({ type: Object }) host!: OpenSCD; @state() validated: Promise = Promise.resolve(); @state() shouldValidate = false; @@ -93,6 +142,10 @@ export class OscdLayout extends LitElement { `; } + protected componentHtml(strings: TemplateStringsArray, ...values: unknown[]): TemplateResult { + return html(strings, ...values); + } + private renderPlugging(): TemplateResult { return html` ${this.renderPluginUI()} ${this.renderDownloadUI()} `; @@ -165,7 +218,7 @@ export class OscdLayout extends LitElement { }, disabled: (): boolean => !this.editor.canUndo, kind: 'static', - content: () => html``, + content: { tag: '' }, }, { icon: 'redo', @@ -176,7 +229,7 @@ export class OscdLayout extends LitElement { }, disabled: (): boolean => !this.editor.canRedo, kind: 'static', - content: () => html``, + content: { tag: '' }, }, ...validators, { @@ -187,7 +240,7 @@ export class OscdLayout extends LitElement { this.dispatchEvent(newHistoryUIEvent(true, HistoryUIKind.log)); }, kind: 'static', - content: () => html``, + content: { tag: '' }, }, { icon: 'history', @@ -197,7 +250,7 @@ export class OscdLayout extends LitElement { this.dispatchEvent(newHistoryUIEvent(true, HistoryUIKind.history)); }, kind: 'static', - content: () => html``, + content: { tag: '' }, }, { icon: 'rule', @@ -207,7 +260,7 @@ export class OscdLayout extends LitElement { this.dispatchEvent(newHistoryUIEvent(true, HistoryUIKind.diagnostic)); }, kind: 'static', - content: () => html``, + content: { tag: '' }, }, 'divider', ...middleMenu, @@ -218,7 +271,7 @@ export class OscdLayout extends LitElement { this.dispatchEvent(newSettingsUIEvent(true)); }, kind: 'static', - content: () => html``, + content: { tag: '' }, }, ...bottomMenu, { @@ -226,7 +279,7 @@ export class OscdLayout extends LitElement { name: 'plugins.heading', action: (): void => this.pluginUI.show(), kind: 'static', - content: () => html``, + content: { tag: '' }, }, ]; } @@ -311,10 +364,7 @@ export class OscdLayout extends LitElement { this.dispatchEvent(newPendingStateEvent((menuContentElement as unknown as MenuPlugin).run())) }, disabled: (): boolean => plugin.requireDoc! && this.doc === null, - content: () => { - if(plugin.content){ return plugin.content(); } - return html``; - }, + content: plugin.content ?? { tag: '' }, kind: kind, } }) @@ -337,7 +387,7 @@ export class OscdLayout extends LitElement { this.dispatchEvent(newPendingStateEvent((menuContentElement as unknown as Validator).validate())) }, disabled: (): boolean => this.doc === null, - content: plugin.content ?? (() => html``), + content: plugin.content ?? { tag: '' }, kind: 'validator', } }); @@ -419,7 +469,7 @@ export class OscdLayout extends LitElement { ${ this.menu .filter(p => (p as MenuItem).content) - .map(p => (p as MenuItem).content()) + .map(p => this.renderPluginContent((p as MenuItem))) } `; @@ -487,6 +537,17 @@ export class OscdLayout extends LitElement { const hasActiveEditors = activeEditors.length > 0; if(!hasActiveEditors){ return html``; } + const renderEditorContent = (doc: XMLDocument | null, activeEditor?: Plugin) => { + const editor = activeEditor; + const requireDoc = editor?.requireDoc + if(requireDoc && !doc) { return html`` } + + const tag = editor?.content?.tag; + if(!tag) { return html`` } + + return this.renderPluginContent(editor); + } + return html` ${renderEditorContent(this.doc, this.activeEditor, )} `; - - function renderEditorContent(doc: XMLDocument | null, activeEditor?: Plugin){ - const editor = activeEditor; - const requireDoc = editor?.requireDoc - if(requireDoc && !doc) { return html`` } - - const content = editor?.content; - if(!content) { return html`` } - - return html`${content()}`; - } } private handleEditorTabActivated(e: TabActivatedEvent){ @@ -578,6 +628,35 @@ export class OscdLayout extends LitElement { } } + protected renderPluginContent(plugin: RenderAblePlugin): TemplateResult { + const tag = plugin.content?.tag ?? ''; + + if (!tag) { + return html``; + } + + const osdcApi = new OscdApi(tag); + return staticTagHtml`<${tag} + .doc=${this.doc} + .docName=${this.docName} + .editCount=${this.editCount} + .plugins=${this.host.storedPlugins} + .docId=${this.host.docId} + .pluginId=${plugin.src} + .nsdoc=${this.host.nsdoc} + .docs=${this.host.docs} + .locale=${this.host.locale} + .oscdApi=${osdcApi} + .editor=${this.editor} + class="${classMap({ + plugin: true, + menu: plugin.kind === 'menu', + validator: plugin.kind === 'validator', + editor: plugin.kind === 'editor', + })}" + >` + } + @@ -630,6 +709,10 @@ export class OscdLayout extends LitElement { font-weight: 300; } + #menuContent { + height: 0px; + } + .landing { position: absolute; text-align: center; diff --git a/packages/openscd/src/addons/Settings.ts b/packages/openscd/src/addons/Settings.ts index 4123af8ac9..a4b2e53406 100644 --- a/packages/openscd/src/addons/Settings.ts +++ b/packages/openscd/src/addons/Settings.ts @@ -22,7 +22,7 @@ import { Switch } from '@material/mwc-switch'; import { getTheme } from '../themes.js'; -import { newLogEvent } from '@openscd/core/foundation/deprecated/history.js'; +import { newLogEvent } from '@compas-oscd/core'; import { Settings, SettingsUIEvent, @@ -31,7 +31,7 @@ import { NsdVersion, LoadNsdocEvent, newLoadNsdocEvent -} from '@openscd/core/foundation/deprecated/settings.js'; +} from '@compas-oscd/core'; import { Languages, languages, loader } from '../translations/loader.js'; import '../WizardDivider.js'; diff --git a/packages/openscd/src/addons/Waiter.ts b/packages/openscd/src/addons/Waiter.ts index 65e7261b69..a3676b745f 100644 --- a/packages/openscd/src/addons/Waiter.ts +++ b/packages/openscd/src/addons/Waiter.ts @@ -8,7 +8,7 @@ import { import '@material/mwc-linear-progress'; -import { PendingStateDetail } from '@openscd/core/foundation/deprecated/waiter.js'; +import { PendingStateDetail } from '@compas-oscd/core'; @customElement('oscd-waiter') export class OscdWaiter extends LitElement { diff --git a/packages/openscd/src/addons/editor/edit-action-to-v1-converter.ts b/packages/openscd/src/addons/editor/edit-action-to-v1-converter.ts index 8dadf86bed..bcaca65469 100644 --- a/packages/openscd/src/addons/editor/edit-action-to-v1-converter.ts +++ b/packages/openscd/src/addons/editor/edit-action-to-v1-converter.ts @@ -7,13 +7,13 @@ import { isMove, isReplace, isSimple, - isUpdate, + isEditorUpdate, Move, Replace, SimpleAction, - Update -} from '@openscd/core/foundation/deprecated/editor.js'; -import { Edit, Insert, Remove, Update as UpdateV2 } from '@openscd/core'; + EditorUpdate +} from '@compas-oscd/core'; +import { Edit, Insert, Remove, Update as UpdateV2 } from '@compas-oscd/core'; import { getReference, SCLTag } from '../../foundation.js'; @@ -30,7 +30,7 @@ function convertSimpleAction(action: SimpleAction): Edit { return convertCreate(action); } else if (isDelete(action)) { return convertDelete(action); - } else if (isUpdate(action)) { + } else if (isEditorUpdate(action)) { return convertUpdate(action); } else if (isMove(action)) { return convertMove(action); @@ -69,7 +69,7 @@ function convertDelete(action: Delete): Remove { }; } -function convertUpdate(action: Update): UpdateV2 { +function convertUpdate(action: EditorUpdate): UpdateV2 { const oldAttributesToRemove: Record = {}; Array.from(action.element.attributes).forEach(attr => { oldAttributesToRemove[attr.name] = null; diff --git a/packages/openscd/src/addons/editor/edit-v1-to-v2-converter.ts b/packages/openscd/src/addons/editor/edit-v1-to-v2-converter.ts index fd5909f4e5..26d47fa63a 100644 --- a/packages/openscd/src/addons/editor/edit-v1-to-v2-converter.ts +++ b/packages/openscd/src/addons/editor/edit-v1-to-v2-converter.ts @@ -1,4 +1,4 @@ -import { Edit, EditV2, isComplex, isInsert, isNamespaced, isRemove, isUpdate, Update } from '@openscd/core'; +import { Edit, EditV2, isComplex, isInsert, isNamespaced, isRemove, isUpdate, Update } from '@compas-oscd/core'; export function convertEditV1toV2(edit: Edit): EditV2 { if (isComplex(edit)) { diff --git a/packages/openscd/src/addons/history/get-log-text.ts b/packages/openscd/src/addons/history/get-log-text.ts index ac13f48f5a..ef40938a68 100644 --- a/packages/openscd/src/addons/history/get-log-text.ts +++ b/packages/openscd/src/addons/history/get-log-text.ts @@ -5,7 +5,7 @@ import { isSetAttributesV2, isSetTextContentV2, isComplexV2 -} from '@openscd/core'; +} from '@compas-oscd/core'; import { get } from 'lit-translate'; export const getLogText = (edit: EditV2): { title: string, message?: string } => { diff --git a/packages/openscd/src/finder-list.ts b/packages/openscd/src/finder-list.ts index f4bcfcf5c0..03dcdd143a 100644 --- a/packages/openscd/src/finder-list.ts +++ b/packages/openscd/src/finder-list.ts @@ -7,7 +7,7 @@ import { query, TemplateResult, } from 'lit-element'; -import { until } from 'lit-html/directives/until'; +import { until } from 'lit-html/directives/until.js'; import { get } from 'lit-translate'; import '@material/mwc-icon'; @@ -19,7 +19,7 @@ import { ListItem } from '@material/mwc-list/mwc-list-item'; import './filtered-list.js'; import { depth } from './foundation.js'; -import { ifDefined } from 'lit-html/directives/if-defined'; +import { ifDefined } from 'lit-html/directives/if-defined.js'; export type Selection = { [name: string]: Selection }; diff --git a/packages/openscd/src/foundation.ts b/packages/openscd/src/foundation.ts index 17996e42fe..d0eae5ca78 100644 --- a/packages/openscd/src/foundation.ts +++ b/packages/openscd/src/foundation.ts @@ -6,13 +6,13 @@ import { Select } from '@material/mwc-select'; import { TextField } from '@material/mwc-textfield'; import AceEditor from 'ace-custom-element'; -import { getChildElementsByTagName } from '@openscd/xml'; +import { getChildElementsByTagName } from '@compas-oscd/xml'; import { WizardTextField } from './wizard-textfield.js'; import { WizardSelect } from './wizard-select.js'; import { WizardCheckbox } from './wizard-checkbox.js'; -import { EditorAction } from '@openscd/core/foundation/deprecated/editor.js'; +import { EditorAction } from '@compas-oscd/core'; export const wizardInputSelector = 'wizard-textfield, mwc-textfield, ace-editor, mwc-select, wizard-select, wizard-checkbox'; diff --git a/packages/openscd/src/foundation/compare.ts b/packages/openscd/src/foundation/compare.ts index 7607184fbe..5cc2424df2 100644 --- a/packages/openscd/src/foundation/compare.ts +++ b/packages/openscd/src/foundation/compare.ts @@ -1,5 +1,5 @@ import { html, TemplateResult } from 'lit-element'; -import { repeat } from 'lit-html/directives/repeat'; +import { repeat } from 'lit-html/directives/repeat.js'; import { get } from 'lit-translate'; import '@material/mwc-list'; diff --git a/packages/openscd/src/foundation/ied.ts b/packages/openscd/src/foundation/ied.ts index e8ea7fb72c..0f38e43b2d 100644 --- a/packages/openscd/src/foundation/ied.ts +++ b/packages/openscd/src/foundation/ied.ts @@ -1,5 +1,5 @@ import { find, identity } from '../foundation.js'; -import { Delete } from '@openscd/core/foundation/deprecated/editor.js'; +import { Delete } from '@compas-oscd/core'; /** * All available FCDA references that are used to link ExtRefs. diff --git a/packages/openscd/src/index.ts b/packages/openscd/src/index.ts new file mode 100644 index 0000000000..d86c8b48c8 --- /dev/null +++ b/packages/openscd/src/index.ts @@ -0,0 +1,9 @@ +// NS Doc +export { initializeNsdoc, Nsdoc } from './foundation/nsdoc.js'; +// Plugin +export { InstalledOfficialPlugin, MenuPosition, PluginKind, Plugin } from "./plugin.js"; +export { ConfigurePluginEvent, ConfigurePluginDetail, newConfigurePluginEvent } from './plugin.events.js'; +export { pluginTag } from './plugin-tag.js'; +// Schema +export { SCL_NAMESPACE } from './schemas.js'; + diff --git a/packages/openscd/src/open-scd.component.ts b/packages/openscd/src/open-scd.component.ts new file mode 100644 index 0000000000..a4ab12f1f7 --- /dev/null +++ b/packages/openscd/src/open-scd.component.ts @@ -0,0 +1,7 @@ +import { customElement } from 'lit-element'; +import { OpenSCD } from './open-scd.js'; + +/** The `` custom element is the main entry point of the + * Open Substation Configuration Designer. */ +@customElement('open-scd') +export class OpenSCDComponent extends OpenSCD { } diff --git a/packages/openscd/src/open-scd.ts b/packages/openscd/src/open-scd.ts index c0f88d50d8..54c88a478d 100644 --- a/packages/openscd/src/open-scd.ts +++ b/packages/openscd/src/open-scd.ts @@ -1,12 +1,10 @@ import { - customElement, html, LitElement, property, state, TemplateResult, } from 'lit-element'; -import { classMap } from 'lit-html/directives/class-map'; import '@material/mwc-icon'; import '@material/mwc-icon-button'; @@ -26,8 +24,8 @@ import '@material/mwc-select'; import '@material/mwc-switch'; import '@material/mwc-textfield'; -import { newOpenDocEvent } from '@openscd/core/foundation/deprecated/open-event.js'; -import { newPendingStateEvent } from '@openscd/core/foundation/deprecated/waiter.js'; +import { newOpenDocEvent } from '@compas-oscd/core'; +import { newPendingStateEvent } from '@compas-oscd/core'; import './addons/Settings.js'; import './addons/Waiter.js'; @@ -44,19 +42,16 @@ import type { PluginSet, Plugin as CorePlugin, EditCompletedEvent, -} from '@openscd/core'; -import { OscdApi, XMLEditor } from '@openscd/core'; +} from '@compas-oscd/core'; +import { OscdApi, XMLEditor } from '@compas-oscd/core'; -import { InstalledOfficialPlugin, MenuPosition, PluginKind, Plugin } from "./plugin.js" +import { InstalledOfficialPlugin, MenuPosition, PluginKind, Plugin, ContentContext } from "./plugin.js" import { ConfigurePluginEvent, ConfigurePluginDetail, newConfigurePluginEvent } from './plugin.events.js'; -import { newLogEvent } from '@openscd/core/foundation/deprecated/history'; +import { newLogEvent } from '@compas-oscd/core'; import { pluginTag } from './plugin-tag.js'; -/** The `` custom element is the main entry point of the - * Open Substation Configuration Designer. */ -@customElement('open-scd') export class OpenSCD extends LitElement { render(): TemplateResult { @@ -120,7 +115,7 @@ export class OpenSCD extends LitElement { this.dispatchEvent(newPendingStateEvent(this.loadDoc(value))); } - @state() private storedPlugins: Plugin[] = []; + @state() storedPlugins: Plugin[] = []; @state() private editCount = -1; @@ -345,7 +340,7 @@ export class OpenSCD extends LitElement { } - protected get locale(): string { + public get locale(): string { return navigator.language || 'en-US'; } @@ -427,27 +422,9 @@ export class OpenSCD extends LitElement { } return { ...plugin, - content: () => { - return staticTagHtml`<${tag} - .doc=${this.doc} - .docName=${this.docName} - .editCount=${this.editCount} - .plugins=${this.storedPlugins} - .docId=${this.docId} - .pluginId=${plugin.src} - .nsdoc=${this.nsdoc} - .docs=${this.docs} - .locale=${this.locale} - .oscdApi=${new OscdApi(tag)} - .editor=${this.editor} - class="${classMap({ - plugin: true, - menu: plugin.kind === 'menu', - validator: plugin.kind === 'validator', - editor: plugin.kind === 'editor', - })}" - >` - }, + content: { + tag + }, }; } @@ -487,7 +464,7 @@ export interface MenuItem { actionItem?: boolean; action?: (event: CustomEvent) => void; disabled?: () => boolean; - content: () => TemplateResult; + content: ContentContext; kind: string; } @@ -535,48 +512,6 @@ export function newSetPluginsEvent(selectedPlugins: Plugin[]): SetPluginsEvent { - -/** - * This is a template literal tag function. See: - * https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals#tagged_templates - * - * Passes its arguments to LitElement's `html` tag after combining the first and - * last expressions with the first two and last two static strings. - * Throws unless the first and last expressions are identical strings. - * - * We need this to get around the expression location limitations documented in - * https://lit.dev/docs/templates/expressions/#expression-locations - * - * After upgrading to Lit 2 we can use their static HTML functions instead: - * https://lit.dev/docs/api/static-html/ - */ -function staticTagHtml( - oldStrings: ReadonlyArray, - ...oldArgs: unknown[] -): TemplateResult { - const args = [...oldArgs]; - const firstArg = args.shift(); - const lastArg = args.pop(); - - if (firstArg !== lastArg) - throw new Error( - `Opening tag <${firstArg}> does not match closing tag .` - ); - - const strings = [...oldStrings] as string[] & { raw: string[] }; - const firstString = strings.shift(); - const secondString = strings.shift(); - - const lastString = strings.pop(); - const penultimateString = strings.pop(); - - strings.unshift(`${firstString}${firstArg}${secondString}`); - strings.push(`${penultimateString}${lastArg}${lastString}`); - - return html(strings, ...args); -} - - function withoutContent

( plugin: P ): P { diff --git a/packages/openscd/src/plugin.ts b/packages/openscd/src/plugin.ts index 41e127a9d1..0bd8a6b83e 100644 --- a/packages/openscd/src/plugin.ts +++ b/packages/openscd/src/plugin.ts @@ -1,10 +1,13 @@ -import { TemplateResult } from 'lit-element'; -import { Plugin as CorePlugin } from "@openscd/core" +import { Plugin as CorePlugin } from "@compas-oscd/core" + +export interface ContentContext { + tag: string; +} export type Plugin = CorePlugin & { official?: boolean; active: boolean; - content?: () => TemplateResult; + content?: ContentContext; }; export type PluginConfig = PluginConfigNotMenu | PluginConfigMenu diff --git a/packages/openscd/src/themes.ts b/packages/openscd/src/themes.ts index ddc542df86..b94bd2e331 100644 --- a/packages/openscd/src/themes.ts +++ b/packages/openscd/src/themes.ts @@ -1,5 +1,5 @@ import { html, TemplateResult } from 'lit-element'; -import { Settings } from '@openscd/core/foundation/deprecated/settings.js'; +import { Settings } from '@compas-oscd/core'; export function getTheme(theme: Settings['theme']): TemplateResult { document.body.style.cssText = bodyStyles[theme]; diff --git a/packages/openscd/src/translations/loader.ts b/packages/openscd/src/translations/loader.ts index c86cb6bf98..d0ddb7b639 100644 --- a/packages/openscd/src/translations/loader.ts +++ b/packages/openscd/src/translations/loader.ts @@ -1,7 +1,7 @@ import { Strings } from 'lit-translate'; import { de } from './de.js'; import { en } from './en.js'; -import { Language } from '@openscd/core/foundation/deprecated/settings.js'; +import { Language } from '@compas-oscd/core'; export interface TranslationObject { [key: string]: string | TranslationObject; diff --git a/packages/openscd/src/wizard-dialog.ts b/packages/openscd/src/wizard-dialog.ts index 6863b0f819..b1a5f502a4 100644 --- a/packages/openscd/src/wizard-dialog.ts +++ b/packages/openscd/src/wizard-dialog.ts @@ -9,7 +9,7 @@ import { html, query, } from 'lit-element'; -import { ifDefined } from 'lit-html/directives/if-defined'; +import { ifDefined } from 'lit-html/directives/if-defined.js'; import { get } from 'lit-translate'; import '@material/mwc-button'; @@ -22,7 +22,7 @@ import { IconButton } from '@material/mwc-icon-button'; import { List } from '@material/mwc-list'; import { Menu } from '@material/mwc-menu'; -import { formatXml } from '@openscd/xml'; +import { formatXml } from '@compas-oscd/xml'; import 'ace-custom-element'; import './wizard-checkbox.js'; @@ -33,7 +33,7 @@ import { newActionEvent, Delete, Create, -} from '@openscd/core/foundation/deprecated/editor.js'; +} from '@compas-oscd/core'; import { Wizard, WizardInputElement, diff --git a/packages/openscd/src/wizards.ts b/packages/openscd/src/wizards.ts index d31ed11b46..7be87c3200 100644 --- a/packages/openscd/src/wizards.ts +++ b/packages/openscd/src/wizards.ts @@ -1,5 +1,5 @@ import { html } from 'lit-element'; -import { repeat } from 'lit-html/directives/repeat'; +import { repeat } from 'lit-html/directives/repeat.js'; import { get } from 'lit-translate'; import '@material/mwc-icon'; @@ -16,7 +16,7 @@ import { Wizard, WizardActor, } from './foundation.js'; -import { EditorAction, SimpleAction } from '@openscd/core/foundation/deprecated/editor.js'; +import { EditorAction, SimpleAction } from '@compas-oscd/core'; interface MergeOptions { title?: string; selected?: (diff: Diff) => boolean; diff --git a/packages/openscd/tsconfig.json b/packages/openscd/tsconfig.json index eb1d48d0df..08c5bb7e05 100644 --- a/packages/openscd/tsconfig.json +++ b/packages/openscd/tsconfig.json @@ -9,6 +9,7 @@ "esModuleInterop": false, "allowSyntheticDefaultImports": true, "experimentalDecorators": true, + "declaration": true, "importHelpers": true, "allowJs": true, "skipLibCheck": true, @@ -16,12 +17,7 @@ "sourceMap": true, "inlineSources": true, "resolveJsonModule": true, - "paths": { - "@openscd/core": ["../core/foundation.ts"], - "@openscd/core/*": ["../core/*"], - "@openscd/xml": ["../xml/src"], - "@openscd/xml/*": ["../xml/*"] - } + "rootDir": "./src" }, "include": ["./src/**/*.ts"] }