diff --git a/test/elements/test-demoelement.ts b/test/elements/test-demoelement.ts
index e4b8c1a..8fea822 100644
--- a/test/elements/test-demoelement.ts
+++ b/test/elements/test-demoelement.ts
@@ -1,27 +1,38 @@
-import { LitElement, customElement, TemplateResult, html } from 'lit-element';
+import { DeesElement, customElement, TemplateResult, html } from '@designestate/dees-element';
import * as domtools from '@designestate/dees-domtools';
@customElement('test-demoelement')
-export class TestDemoelement extends LitElement {
+export class TestDemoelement extends DeesElement {
public static demo = () => html``;
public render() {
return html`
-
This is a demo element
+ This is a demo element
+
+ You have selected the ${this.goBright ? 'bright' : 'dark'} theme;
+
`;
}
}
diff --git a/ts_web/elements/wcc-dashboard.ts b/ts_web/elements/wcc-dashboard.ts
index fa01e63..1c8c4f6 100644
--- a/ts_web/elements/wcc-dashboard.ts
+++ b/ts_web/elements/wcc-dashboard.ts
@@ -98,9 +98,14 @@ export class WccDashboard extends LitElement {
>
${(() => {
- if (this.selectedType === 'page') {
- return this.selectedItem();
- } else if (this.selectedItem) {
+ if (this.selectedType === 'page' && this.selectedItem) {
+ if (typeof this.selectedItem === 'function') {
+ return this.selectedItem();
+ } else {
+ console.error('The selected item looks strange:')
+ console.log(this.selectedItem);
+ }
+ } else if (this.selectedType === 'element' && this.selectedItem) {
// console.log(this.selectedItem);
const anonItem: any = this.selectedItem;
if (!anonItem.demo) {
@@ -139,7 +144,7 @@ export class WccDashboard extends LitElement {
this.selectedItem = this.elements[routeInfo.params.itemName];
} else if (routeInfo.params.itemType === 'page') {
this.selectedType = 'page';
- this.selectedItem = this.pages[routeInfo.params.pageName];
+ this.selectedItem = this.pages[routeInfo.params.itemName];
}
const domtoolsInstance = await plugins.deesDomtools.elementBasic.setup();
domtoolsInstance.setVirtualViewport(routeInfo.params.viewport as TViewport);
@@ -173,8 +178,7 @@ export class WccDashboard extends LitElement {
this.domtools.router.pushUrl(
`/${this.selectedType}/${this.selectedItemName}/${this.selectedViewport}/${
this.selectedTheme
- }`,
- 0
+ }`
);
}
}
diff --git a/ts_web/elements/wcc-properties.ts b/ts_web/elements/wcc-properties.ts
index fbc7d3b..f621711 100644
--- a/ts_web/elements/wcc-properties.ts
+++ b/ts_web/elements/wcc-properties.ts
@@ -130,6 +130,9 @@ export class WccProperties extends LitElement {
${(() => {
if (this.selectedItem && !(this.selectedItem instanceof TemplateResult)) {
const anonItem: any = this.selectedItem;
+ if (!anonItem._classProperties) {
+ return `You have selected a page!`;
+ }
const classProperties: Map = anonItem._classProperties;
const returnArray: TemplateResult[] = [];
for (const key of classProperties.keys()) {
diff --git a/ts_web/elements/wcc-sidebar.ts b/ts_web/elements/wcc-sidebar.ts
index 84c1025..3054676 100644
--- a/ts_web/elements/wcc-sidebar.ts
+++ b/ts_web/elements/wcc-sidebar.ts
@@ -10,7 +10,7 @@ export class WccSidebar extends LitElement {
public websites: string[] = [];
@property({ attribute: false })
- public selectedItem: LitElement | () => TemplateResult;
+ public selectedItem: LitElement | (() => TemplateResult);
@property({ attribute: false })
public selectedType: TElementType;
@@ -92,10 +92,9 @@ export class WccSidebar extends LitElement {
- lele-catalog
+ wcc-tools
- Lossless GmbH