1.0.60

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "@designestate/dees-catalog",
-  "version": "1.0.57",
+  "version": "1.0.60",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "@designestate/dees-catalog",
-      "version": "1.0.57",
+      "version": "1.0.60",
       "license": "MIT",
       "dependencies": {
         "@designestate/dees-domtools": "^1.0.91",

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@designestate/dees-catalog",
-  "version": "1.0.57",
+  "version": "1.0.60",
   "private": false,
   "description": "website for lossless.com",
   "main": "dist_ts_web/index.js",

ts_web/elements/dees-stepper.ts

@@ -15,6 +15,7 @@ export interface IStep {
   title: string;
   content: TemplateResult;
   validationFunc?: (stepper: DeesStepper, htmlElement: HTMLElement) => Promise<any>;
+  onReturnToStepFunc?: (stepper: DeesStepper, htmlElement: HTMLElement) => Promise<any>;
   validationFuncCalled?: boolean;
 }
 
@@ -98,13 +99,13 @@ export class DeesStepper extends DeesElement {
         color: ${cssManager.bdTheme('#333', '#fff')};
         margin: auto;
         margin-bottom: 20px;
-        filter: opacity(0.5);
+        filter: opacity(0.5) grayscale(1);
         box-shadow: 0px 0px 3px #00000010;
       }
 
       .step.selected {
         pointer-events: all;
-        filter: opacity(1);
+        filter: opacity(1) grayscale(0);
         box-shadow: 0px 0px 5px #00000010;
       }
 
@@ -209,9 +210,12 @@ export class DeesStepper extends DeesElement {
     this.scroller.to(scrollPosition);
   }
 
-  public goBack() {
+  public async goBack() {
     const currentIndex = this.steps.findIndex(stepArg => stepArg === this.selectedStep);
     this.selectedStep = this.steps[currentIndex - 1];
+    await this.domtoolsPromise;
+    await this.domtools.convenience.smartdelay.delayFor(100);
+    this.selectedStep.onReturnToStepFunc?.(this, this.shadowRoot.querySelector('.selected'));
   }
 
   public goNext() {