@salesforcedevs/dw-components 1.3.148-canary.28 → 1.3.148-canary.30

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@salesforcedevs/dw-components",
-    "version": "1.3.148-canary.28",
+    "version": "1.3.148-canary.30",
     "description": "Lightning web components for https://developer.salesforce.com",
     "license": "MIT",
     "engines": {

package/src/modules/dw/j2sCardSequence/j2sCardSequence.html

@@ -21,7 +21,14 @@
                     step-index={index}
                     step-total-count={stepsData.length}
                     user-info={formIncomingUserInfo}
-                ></dw-j2s-card-sequence-step>
+                >
+                    <div
+                        if:true={stepDatum.formData}
+                        slot="card-step-captcha-slot"
+                    >
+                        <slot name="captcha-slot"></slot>
+                    </div>
+                </dw-j2s-card-sequence-step>
             </dx-step-sequence-step>
         </template>
     </dx-step-sequence>

package/src/modules/dw/j2sCardSequence/j2sCardSequence.ts

@@ -226,11 +226,10 @@ export default class J2sCardSequence extends LightningElement {
             // If the recaptcha element expires on its own while you are not on the 2nd (form) step, it messes with the
             // page's layout (basically breaks it). So, we need to reset it _before_ expiration if you leave that step.
             // We do it with a timeout so that the token is not immediately wiped if the user goes back and forth a bit.
-            this._recaptchaResetTimeoutId = window.setTimeout(() => {
-                this._recaptchaResetTimeoutId = null;
-                this.recaptchaToken = "";
-                (window as any).grecaptcha.reset();
-            }, 1000 * 30 /* 30 seconds */);
+            this._recaptchaResetTimeoutId = window.setTimeout(
+                () => this.resetRecaptcha(),
+                1000 * 30 /* 30 seconds */
+            );
         }
     }
 
@@ -274,6 +273,7 @@ export default class J2sCardSequence extends LightningElement {
                 if (resOutput?.status === "success") {
                     this.jumpToStepIndex(2, false);
                     this.initialStepIndex = 0; // don't save final step in storage; rather, reset the starting step
+                    this.resetRecaptcha();
                 } else {
                     throw new Error(
                         `Form submission failed. (status: ${resOutput.status}, message: ${resOutput.errorMessage})`
@@ -318,6 +318,13 @@ export default class J2sCardSequence extends LightningElement {
         );
     }
 
+    private resetRecaptcha() {
+        clearTimeout(this._recaptchaResetTimeoutId as number);
+        this._recaptchaResetTimeoutId = null;
+        this.recaptchaToken = "";
+        (window as any).grecaptcha.reset();
+    }
+
     private jumpToStepIndex(stepIndex: number, andStoreIndex = true) {
         if (andStoreIndex) {
             this.initialStepIndex = stepIndex; // update sessionStorage value

package/src/modules/dw/j2sCardSequenceStep/j2sCardSequenceStep.html

@@ -29,7 +29,7 @@
                         recaptcha-token={recaptchaToken}
                     >
                         <div slot="form-captcha-slot">
-                            <slot name="captcha-slot"></slot>
+                            <slot name="card-step-captcha-slot"></slot>
                         </div>
                     </dw-j2s-form>
                 </template>