From 7ce8393f33cdf3405ef76cbe1573e2d5730597d1 Mon Sep 17 00:00:00 2001
From: Christoph Reiter <reiter.christoph@gmail.com>
Date: Mon, 20 Apr 2020 16:35:15 +0200
Subject: [PATCH] Export vpu-icon instead of defining it always; Move demo to
scoped elements
---
packages/common/index.js | 4 +++-
packages/common/package.json | 1 +
packages/common/{vpu-icon.js => src/icon.js} | 8 +++-----
packages/common/styles.js | 2 +-
packages/common/vpu-common-demo.js | 15 +++++++++++++--
5 files changed, 21 insertions(+), 9 deletions(-)
rename packages/common/{vpu-icon.js => src/icon.js} (96%)
diff --git a/packages/common/index.js b/packages/common/index.js
index a562cd77..bf45336a 100644
--- a/packages/common/index.js
+++ b/packages/common/index.js
@@ -1,4 +1,6 @@
import {EventBus} from './src/eventbus.js';
import {createLinkedAbortController, createTimeoutAbortSignal} from './src/abort.js';
+import {getIconSVGURL, getIconCSS, Icon} from './src/icon.js';
-export {EventBus, createLinkedAbortController, createTimeoutAbortSignal};
\ No newline at end of file
+export {EventBus, createLinkedAbortController, createTimeoutAbortSignal};
+export {getIconSVGURL, getIconCSS, Icon};
\ No newline at end of file
diff --git a/packages/common/package.json b/packages/common/package.json
index b669ea0f..74c3637c 100644
--- a/packages/common/package.json
+++ b/packages/common/package.json
@@ -31,6 +31,7 @@
"lint": "eslint ."
},
"dependencies": {
+ "@open-wc/scoped-elements": "^1.0.8",
"@sentry/browser": "^5.13.2",
"i18next": "^19.3.2",
"lit-element": "^2.2.1"
diff --git a/packages/common/vpu-icon.js b/packages/common/src/icon.js
similarity index 96%
rename from packages/common/vpu-icon.js
rename to packages/common/src/icon.js
index c6e8bd39..1a4f9dd6 100644
--- a/packages/common/vpu-icon.js
+++ b/packages/common/src/icon.js
@@ -1,7 +1,7 @@
import {html, LitElement, css} from 'lit-element';
import {unsafeHTML} from 'lit-html/directives/unsafe-html.js';
import {until} from 'lit-html/directives/until.js';
-import * as commonUtils from './utils.js';
+import * as commonUtils from '../utils.js';
// Use in case the icon fails to load
const errorIcon = `
@@ -74,7 +74,7 @@ async function getSVGTextElementCached(name) {
/**
* For icon names see https://lineicons.com
*/
-class Icon extends LitElement {
+export class Icon extends LitElement {
constructor() {
super();
@@ -112,6 +112,4 @@ class Icon extends LitElement {
${until(svg)}
`;
}
-}
-
-commonUtils.defineCustomElement('vpu-icon', Icon);
+}
\ No newline at end of file
diff --git a/packages/common/styles.js b/packages/common/styles.js
index 6d89a463..3408b335 100644
--- a/packages/common/styles.js
+++ b/packages/common/styles.js
@@ -1,5 +1,5 @@
import {css, unsafeCSS, CSSResult} from 'lit-element';
-import {getIconSVGURL} from './vpu-icon.js';
+import {getIconSVGURL} from './src/icon.js';
/**
* We want to have "neutral" colors here
diff --git a/packages/common/vpu-common-demo.js b/packages/common/vpu-common-demo.js
index 01c13798..355270c6 100644
--- a/packages/common/vpu-common-demo.js
+++ b/packages/common/vpu-common-demo.js
@@ -1,19 +1,30 @@
import {i18n} from './i18n.js';
import {css, html, LitElement} from 'lit-element';
+import {ScopedElementsMixin} from '@open-wc/scoped-elements';
import * as commonUtils from './utils.js';
import * as commonStyles from './styles.js';
import './vpu-mini-spinner.js';
import './vpu-spinner.js';
-import {getIconCSS} from './vpu-icon.js';
+import {getIconCSS, Icon} from './index.js';
import './vpu-button.js';
-class VpuCommonDemo extends LitElement {
+class VpuCommonDemo extends ScopedElementsMixin(LitElement) {
constructor() {
super();
this.lang = 'de';
this.noAuth = false;
}
+ static get scopedElements() {
+ return {
+ 'vpu-icon': Icon,
+ 'vpu-mini-spinner': customElements.get('vpu-mini-spinner'),
+ 'vpu-spinner': customElements.get('vpu-spinner'),
+ 'vpu-button': customElements.get('vpu-button'),
+ 'vpu-auth': customElements.get('vpu-auth'),
+ };
+ }
+
static get properties() {
return {
lang: { type: String },
--
GitLab