diff --git a/packages/app-shell/package.json b/packages/app-shell/package.json index 34f23d2f5d04b33ad4be63bd45aab3b1e576d086..764e40554656521f2c8b1e6b7d8316c0b666d6f3 100644 --- a/packages/app-shell/package.json +++ b/packages/app-shell/package.json @@ -29,6 +29,7 @@ "vpu-person-profile": "file:./vendor/person-profile" }, "dependencies": { + "@open-wc/scoped-elements": "^1.0.8", "i18next": "^19.4.1", "lit-element": "^2.2.1", "lit-html": "^1.1.2", diff --git a/packages/app-shell/src/build-info.js b/packages/app-shell/src/build-info.js index 6be385b6538a539de5ebe711de3c165676bfd4e4..faac3a387e0ef6a9bf217bc5ddb7f838e0742689 100644 --- a/packages/app-shell/src/build-info.js +++ b/packages/app-shell/src/build-info.js @@ -1,9 +1,8 @@ import {html, LitElement, css} from 'lit-element'; -import * as commonUtils from 'vpu-common/utils'; import * as commonStyles from 'vpu-common/styles'; import buildinfo from 'consts:buildinfo'; -class VPUBuildInfo extends LitElement { +export class BuildInfo extends LitElement { constructor() { super(); @@ -33,6 +32,4 @@ class VPUBuildInfo extends LitElement { </a> `; } -} - -commonUtils.defineCustomElement('vpu-build-info', VPUBuildInfo); +} \ No newline at end of file diff --git a/packages/app-shell/src/index.js b/packages/app-shell/src/index.js index 93857258ee6d2e6003c0e4af1671dd06d48c10db..7fda786e371d714207ac36b98aae5115452b72f8 100644 --- a/packages/app-shell/src/index.js +++ b/packages/app-shell/src/index.js @@ -1,6 +1,7 @@ import {createI18nInstance} from './i18n.js'; import {html, css, LitElement} from 'lit-element'; -import 'vpu-language-select'; +import {ScopedElementsMixin} from '@open-wc/scoped-elements'; +import {LanguageSelect} from 'vpu-language-select'; import 'vpu-common/vpu-button.js'; import 'vpu-auth'; import 'vpu-notification'; @@ -10,8 +11,8 @@ import buildinfo from 'consts:buildinfo'; import {classMap} from 'lit-html/directives/class-map.js'; import {Router} from './router.js'; import * as events from 'vpu-common/events.js'; -import './build-info.js'; -import './tugraz-logo.js'; +import {BuildInfo} from './build-info.js'; +import {TUGrazLogo} from './tugraz-logo.js'; import {send as notify} from 'vpu-notification'; import {userProfileMeta} from './vpu-app-shell-user-profile.js'; import {appWelcomeMeta} from './vpu-app-shell-welcome.js'; @@ -41,8 +42,7 @@ const importNotify = async (promise) => { } }; - -class VPUApp extends LitElement { +class VPUApp extends ScopedElementsMixin(LitElement) { constructor() { super(); this.lang = i18n.language; @@ -62,6 +62,18 @@ class VPUApp extends LitElement { this._attrObserver = new MutationObserver(this.onAttributeObserved); } + static get scopedElements() { + return { + 'vpu-language-select': LanguageSelect, + 'vpu-tugraz-logo': TUGrazLogo, + 'vpu-build-info': BuildInfo, + // https://github.com/open-wc/open-wc/issues/1541 + 'vpu-auth': customElements.get('vpu-auth'), + 'vpu-notification': customElements.get('vpu-notification'), + 'vpu-icon': customElements.get('vpu-icon'), + }; + } + onAttributeObserved(mutationsList, observer) { for(let mutation of mutationsList) { if (mutation.type === 'attributes') { diff --git a/packages/app-shell/src/tugraz-logo.js b/packages/app-shell/src/tugraz-logo.js index 51b654cddca0d3670824dca5c6dbbc37cca2c35f..a77614c3a6619f34b7374a36da12c3a518caedc0 100644 --- a/packages/app-shell/src/tugraz-logo.js +++ b/packages/app-shell/src/tugraz-logo.js @@ -1,11 +1,10 @@ import {html, LitElement, css} from 'lit-element'; -import * as commonUtils from 'vpu-common/utils'; import * as commonStyles from 'vpu-common/styles'; import {createI18nInstance} from './i18n.js'; const i18n = createI18nInstance(); -class VPUTUGrazLogo extends LitElement { +export class TUGrazLogo extends LitElement { constructor() { super(); @@ -77,6 +76,4 @@ class VPUTUGrazLogo extends LitElement { </a> `; } -} - -commonUtils.defineCustomElement('vpu-tugraz-logo', VPUTUGrazLogo); +} \ No newline at end of file diff --git a/packages/app-shell/src/vpu-app-shell-user-profile.js b/packages/app-shell/src/vpu-app-shell-user-profile.js index 480d8b8ef5b0279882533837f9d1b3394d15c65f..9809a332035553d36f56c47fc976f2b244152b2e 100644 --- a/packages/app-shell/src/vpu-app-shell-user-profile.js +++ b/packages/app-shell/src/vpu-app-shell-user-profile.js @@ -2,20 +2,26 @@ import {createI18nInstance} from './i18n.js'; import {css, html, LitElement} from 'lit-element'; import * as commonUtils from 'vpu-common/utils'; import * as commonStyles from 'vpu-common/styles'; +import {ScopedElementsMixin} from '@open-wc/scoped-elements'; import 'vpu-person-profile'; const i18n = createI18nInstance(); -class AppShellUserProfile extends LitElement { +class AppShellUserProfile extends ScopedElementsMixin(LitElement) { constructor() { super(); this.lang = i18n.language; this._personId = window.VPUPersonId; this.entryPointUrl = commonUtils.getAPiUrl(); - } + static get scopedElements() { + return { + 'vpu-person-profile': customElements.get('vpu-person-profile'), + }; + } + static get properties() { return { lang: { type: String }, diff --git a/packages/app-shell/src/vpu-app-shell-welcome.js b/packages/app-shell/src/vpu-app-shell-welcome.js index cdceed44d0d8debb1b516d69d439bc91d068d6ae..9641222b7a2aeeb8df8a817fca61242ca5533c49 100644 --- a/packages/app-shell/src/vpu-app-shell-welcome.js +++ b/packages/app-shell/src/vpu-app-shell-welcome.js @@ -1,11 +1,12 @@ import {createI18nInstance} from './i18n.js'; import {css, html, LitElement} from 'lit-element'; +import {ScopedElementsMixin} from '@open-wc/scoped-elements'; import * as commonUtils from 'vpu-common/utils'; import * as commonStyles from 'vpu-common/styles'; const i18n = createI18nInstance(); -class AppShellWelcome extends LitElement { +class AppShellWelcome extends ScopedElementsMixin(LitElement) { constructor() { super(); diff --git a/packages/app-shell/vendor/language-select b/packages/app-shell/vendor/language-select index 9a3c9052ed1809b302d2738e6aa3da7e4d29b819..f6797279a5f00dfe4db52e44f1e016aedeec6a6d 160000 --- a/packages/app-shell/vendor/language-select +++ b/packages/app-shell/vendor/language-select @@ -1 +1 @@ -Subproject commit 9a3c9052ed1809b302d2738e6aa3da7e4d29b819 +Subproject commit f6797279a5f00dfe4db52e44f1e016aedeec6a6d