1.0.52

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "@designestate/dees-wcctools",
-  "version": "1.0.50",
+  "version": "1.0.52",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@designestate/dees-wcctools",
-  "version": "1.0.50",
+  "version": "1.0.52",
   "private": false,
   "description": "wcc tools for creating element catalogues",
   "main": "dist_ts_web/index.js",

ts_web/elements/wcc-dashboard.ts

@@ -102,7 +102,7 @@ export class WccDashboard extends LitElement {
             if (typeof this.selectedItem === 'function') {
               return this.selectedItem();
             } else {
-              console.error('The selected item looks strange:')
+              console.error('The selected item looks strange:');
               console.log(this.selectedItem);
             }
           } else if (this.selectedType === 'element' && this.selectedItem) {
@@ -138,22 +138,25 @@ export class WccDashboard extends LitElement {
 
   public async firstUpdated() {
     this.domtools = await plugins.deesDomtools.DomTools.setupDomTools();
-    this.domtools.router.on('/wcctools-route/:itemType/:itemName/:viewport/:theme', async (routeInfo) => {
-      this.selectedType = routeInfo.params.itemType as TElementType;
-      this.selectedItemName = routeInfo.params.itemName;
-      this.selectedViewport = routeInfo.params.viewport as TViewport;
-      this.selectedTheme = routeInfo.params.theme as TTheme;
-      if (routeInfo.params.itemType === 'element') {
-        this.selectedItem = this.elements[routeInfo.params.itemName];
-      } else if (routeInfo.params.itemType === 'page') {
-        this.selectedItem = this.pages[routeInfo.params.itemName];
+    this.domtools.router.on(
+      '/wcctools-route/:itemType/:itemName/:viewport/:theme',
+      async (routeInfo) => {
+        this.selectedType = routeInfo.params.itemType as TElementType;
+        this.selectedItemName = routeInfo.params.itemName;
+        this.selectedViewport = routeInfo.params.viewport as TViewport;
+        this.selectedTheme = routeInfo.params.theme as TTheme;
+        if (routeInfo.params.itemType === 'element') {
+          this.selectedItem = this.elements[routeInfo.params.itemName];
+        } else if (routeInfo.params.itemType === 'page') {
+          this.selectedItem = this.pages[routeInfo.params.itemName];
+        }
+        const domtoolsInstance = await plugins.deesDomtools.elementBasic.setup();
+        domtoolsInstance.setVirtualViewport(routeInfo.params.viewport as TViewport);
+        this.selectedTheme === 'bright'
+          ? domtoolsInstance.themeManager.goBright()
+          : domtoolsInstance.themeManager.goDark();
       }
-      const domtoolsInstance = await plugins.deesDomtools.elementBasic.setup();
-      domtoolsInstance.setVirtualViewport(routeInfo.params.viewport as TViewport);
-      this.selectedTheme === 'bright' ? 
-      domtoolsInstance.themeManager.goBright() :
-      domtoolsInstance.themeManager.goDark();
-    });
+    );
   }
 
   private updating = false;
@@ -178,9 +181,7 @@ export class WccDashboard extends LitElement {
 
   public buildUrl() {
     this.domtools.router.pushUrl(
-      `/wcctools-route/${this.selectedType}/${this.selectedItemName}/${this.selectedViewport}/${
-        this.selectedTheme
-      }`
+      `/wcctools-route/${this.selectedType}/${this.selectedItemName}/${this.selectedViewport}/${this.selectedTheme}`
     );
   }
 }

ts_web/elements/wcc-sidebar.ts

@@ -134,7 +134,7 @@ export class WccSidebar extends LitElement {
             const item = this.dashboardRef.elements[elementName];
             return html`
               <div
-                class="selectOption ${this.selectedItem === item ? 'selected' : console.log('hi')}"
+                class="selectOption ${this.selectedItem === item ? 'selected' : null}"
                 @click=${async () => {
                   const domtools = await plugins.deesDomtools.DomTools.setupDomTools();
                   this.selectItem('element', elementName, item);