gw-customer-accounts 1.4.0 → 1.4.2

package/dist/sign-in.js

@@ -1 +1 @@
-import{G as l,a as c}from"./assets/index-DkUQsudo.js";customElements.define("gw-customer-accounts-sign-in",class extends HTMLElement{constructor(){super(),this.signInType=this.getAttribute("type"),this.signInBlock=this.querySelector("[data-sign-in-block]"),this.signInType!=="password"&&(this.verifyCodeBlock=this.querySelector("[data-verify-code-block]"),this.tryAnotherEmailButton=this.querySelector("[data-try-another-email]"),this.sendAnotherCodeButton=this.querySelector("[data-send-another-code]"),this.inputtedEmail="",this.inputtedCode="")}connectedCallback(){this.signInType==="password"?this._setupPasswordBasedAuth():this._setupEmailBasedAuth()}_setupPasswordBasedAuth(){const t={signIn:this.querySelector("[data-sign-in-form]"),registration:this.querySelector("[data-registeration-form]"),forgotPassword:this.querySelector("[data-forgot-password-form]")},e={signIn:this.querySelectorAll("[data-sign-in-link]"),createAccount:this.querySelectorAll("[data-create-account-link]"),forgotPassword:this.querySelectorAll("[data-forgot-password-link]")};this._setupFormNavigation(e,t),this._setupFormSubmissions(Object.values(t)),this._handleFormVisibility(t)}_handleFormVisibility(t){const o=new URLSearchParams(window.location.search).get("form_id");o&&Object.values(t).forEach(r=>{const i=r.querySelector(".gw-error-message");o===r.getAttribute("id")?(r&&r.removeAttribute("hidden"),i&&i.removeAttribute("hidden"),o==="recover_customer"&&this._showPasswordResetMessage(r),o==="customer_login"&&this._showLoginErrorMessage(r)):(r&&r.setAttribute("hidden",""),i&&i.setAttribute("hidden",""))})}_showPasswordResetMessage(t){const e=t.querySelector("[data-forgot-password-error-message]");e&&(e.textContent="If we find your account in our system, you will receive a password reset link to your email address.")}_showLoginErrorMessage(t){const e=t.querySelector("[data-login-error-message]");e&&(e.textContent="The email or password you entered is incorrect. Please try again.")}_setupFormNavigation(t,e){const o=i=>{Object.values(e).forEach(n=>{n.setAttribute("hidden","")}),i.removeAttribute("hidden")},r=()=>{const i=new URL(window.location.href);i.searchParams.delete("form_id"),window.history.replaceState({},"",i.toString())};t.createAccount.forEach(i=>{i.addEventListener("click",()=>{o(e.registration),r()})}),t.forgotPassword.forEach(i=>{i.addEventListener("click",()=>{o(e.forgotPassword),r()})}),t.signIn.forEach(i=>{i.addEventListener("click",()=>{o(e.signIn),r()})})}_setupFormSubmissions(t){t.forEach(e=>{const o=new URL(window.location.href);o.searchParams.append("my-account-open",!0),o.searchParams.append("form_id",e.getAttribute("id"));const r=e.querySelector('input[name="return_to"]'),i=e.querySelector('input[name="return_url"]');r&&(r.value=o.pathname+o.search),i&&(i.value=o.pathname+o.search),e.addEventListener("submit",n=>{n.preventDefault(),e.querySelectorAll('button[type="submit"]').forEach(a=>{a.disabled=!0;const s=a.querySelector("[data-loader]");s&&(s.hidden=!1)}),Shopify.captcha.protect(e,()=>{e.submit()})})})}_setupEmailBasedAuth(){this._handleEmailSubmitForm(),this._handleInputCodeGroup(),this.tryAnotherEmailButton.addEventListener("click",()=>{this._resetToEmailInput()}),this.sendAnotherCodeButton.addEventListener("click",()=>{this._resendVerificationCode()})}_resetToEmailInput(){this.signInBlock.removeAttribute("hidden"),this.verifyCodeBlock.setAttribute("hidden","");const t=this.signInBlock.querySelector("sl-input");t.value="",t.focus(),this.inputtedEmail="",this.inputtedCode="",this.acceptsMarketing=!1}_resendVerificationCode(){this._submitEmailForm(this.querySelector("[data-sign-in-form]")),l.notify("Another code has been sent to your email.")}async _handleEmailSubmitForm(){await Promise.all([customElements.whenDefined("sl-input")]).then(()=>{const t=this.querySelector("[data-sign-in-form]"),e=this.querySelector("[data-email-error]");t.addEventListener("sl-invalid",o=>{o.preventDefault(),e.textContent=o.target.validationMessage,e.hidden=!1,o.target.focus()},{capture:!0}),t.addEventListener("submit",o=>{o.preventDefault(),e.hidden=!0,e.textContent="",this._submitEmailForm(t).then(()=>{const r=this.verifyCodeBlock.querySelector(".code-input");r&&r.focus()})})})}async _submitEmailForm(t){const e=t.querySelector('button[type="submit"]');e.disabled=!0,e.querySelector("[data-loader]").hidden=!1;const o=new FormData(t);this.inputtedEmail=o.get("email"),o.has("accepts_marketing")&&(this.acceptsMarketing=o.get("accepts_marketing"));let r="";const i=await this._fetchCaptchaToken();i&&(r=i);try{const n=await this._request({customerEmail:this.inputtedEmail,token:r},c.ENDPOINTS.AUTH.SIGN_IN);if(n.error){console.error(n.error);return}const a=this.querySelector("[data-code-sent-to]");return a&&(a.textContent=this.inputtedEmail),this.signInBlock.setAttribute("hidden",""),this.verifyCodeBlock.removeAttribute("hidden"),n}catch(n){console.error(n),alert("An error occurred. Please try again later.")}finally{e.disabled=!1,e.querySelector("[data-loader]").hidden=!0}}async _submitVerificationCode(){var n,a;const t=this.querySelector(".gw-verify-code__actions"),e=t.querySelectorAll("button, a"),o=t.querySelector("[data-verify-error]"),r=t.querySelector("[data-loader]"),i=this.querySelectorAll("input.code-input");try{i.forEach(u=>{u.disabled=!0}),e.forEach(u=>{u.disabled=!0,u.hidden=!0}),o.hidden=!0,r.hidden=!1;const s=await this._request({customerEmail:this.inputtedEmail,code:this.inputtedCode,is_marketing:this.acceptsMarketing},c.ENDPOINTS.AUTH.VERIFY_CODE);if(!s.url)throw new Error("Verification failed");localStorage.setItem(c.STORAGE_KEYS.TOKEN,s.token),localStorage.setItem(c.STORAGE_KEYS.EMAIL,this.inputtedEmail);const d=await fetch(s.url);if(d.error)throw new Error(d.error);const f=await(await fetch(window.location.href)).text(),h=new DOMParser().parseFromString(f,"text/html"),m=(a=(n=h.querySelector("#gw-customer-accounts-template").content)==null?void 0:n.querySelector("gw-integrations-loyalty-points"))==null?void 0:a.getAttribute("page-url");document.documentElement.innerHTML=h.documentElement.innerHTML,document.dispatchEvent(new CustomEvent("gw-customer-accounts:login"));const p=sessionStorage.getItem(c.STORAGE_KEYS.REDIRECT_URL);if(p&&(sessionStorage.removeItem(c.STORAGE_KEYS.REDIRECT_URL),window.location.href=p),!m)return;window.location.pathname.includes(m)&&window.location.reload()}catch(s){console.error(s),setTimeout(()=>{i[i.length-1].focus()})}finally{i.forEach(s=>{s.disabled=!1}),e.forEach(s=>{s.disabled=!1,s.hidden=!1}),o.hidden=!1,r.hidden=!0}}async _request(t,e,o="POST"){return await(await fetch(l.baseURL+e,{method:o,body:JSON.stringify(t),mode:"cors",cache:"no-cache",headers:{"Content-Type":"application/json"}})).json()}_handleInputCodeGroup(){const t=[...this.querySelectorAll("input.code-input")];t.forEach((e,o)=>{e.addEventListener("keydown",r=>{(r.ctrlKey||r.metaKey)&&r.keyCode===86||(r.keyCode!==8&&(r.keyCode<48||r.keyCode>57)&&r.preventDefault(),r.keyCode===8&&r.target.value===""&&t[Math.max(0,o-1)].focus())}),e.addEventListener("input",r=>{const[i,...n]=r.target.value;r.target.value=i??"";const a=o===t.length-1,s=i!==void 0;s&&!a&&(t[o+1].focus(),t[o+1].value=n.join(""),t[o+1].dispatchEvent(new Event("input"))),s&&a&&t.every(d=>d.value)&&(this.inputtedCode=t.map(d=>d.value).join(""),this._submitVerificationCode())})})}async _fetchCaptchaToken(){const e=await(await fetch(l.baseURL+c.ENDPOINTS.AUTH.GET_CAPTCHA_TOKEN)).json();return e==null?void 0:e.token}});
+import{G as l,a as c}from"./assets/index-DkUQsudo.js";customElements.define("gw-customer-accounts-sign-in",class extends HTMLElement{constructor(){super(),this.signInType=this.getAttribute("type"),this.signInBlock=this.querySelector("[data-sign-in-block]"),this.signInType!=="password"&&(this.verifyCodeBlock=this.querySelector("[data-verify-code-block]"),this.tryAnotherEmailButton=this.querySelector("[data-try-another-email]"),this.sendAnotherCodeButton=this.querySelector("[data-send-another-code]"),this.inputtedEmail="",this.inputtedCode="")}connectedCallback(){this.signInType==="password"?this._setupPasswordBasedAuth():this._setupEmailBasedAuth()}_setupPasswordBasedAuth(){const t={signIn:this.querySelector("[data-sign-in-form]"),registration:this.querySelector("[data-registeration-form]"),forgotPassword:this.querySelector("[data-forgot-password-form]")},e={signIn:this.querySelectorAll("[data-sign-in-link]"),createAccount:this.querySelectorAll("[data-create-account-link]"),forgotPassword:this.querySelectorAll("[data-forgot-password-link]")};this._setupFormNavigation(e,t),this._setupFormSubmissions(Object.values(t)),this._handleFormVisibility(t)}_handleFormVisibility(t){const r=new URLSearchParams(window.location.search).get("form_id");r&&Object.values(t).forEach(o=>{const s=o.querySelector(".gw-error-message");r===o.getAttribute("id")?(o&&o.removeAttribute("hidden"),s&&s.removeAttribute("hidden"),r==="recover_customer"&&this._showPasswordResetMessage(o),r==="customer_login"&&this._showLoginErrorMessage(o)):(o&&o.setAttribute("hidden",""),s&&s.setAttribute("hidden",""))})}_showPasswordResetMessage(t){const e=t.querySelector("[data-forgot-password-error-message]");e&&(e.textContent="We've sent you an email to reset your password");const r=t.querySelector("[data-forgot-password-subtext]");r&&r.remove()}_showLoginErrorMessage(t){const e=t.querySelector("[data-login-error-message]");e&&(e.textContent="The email or password you entered is incorrect. Please try again.")}_setupFormNavigation(t,e){const r=s=>{Object.values(e).forEach(n=>{n.setAttribute("hidden","")}),s.removeAttribute("hidden")},o=()=>{const s=new URL(window.location.href);s.searchParams.delete("form_id"),window.history.replaceState({},"",s.toString())};t.createAccount.forEach(s=>{s.addEventListener("click",()=>{r(e.registration),o()})}),t.forgotPassword.forEach(s=>{s.addEventListener("click",()=>{r(e.forgotPassword),o()})}),t.signIn.forEach(s=>{s.addEventListener("click",()=>{r(e.signIn),o()})})}_setupFormSubmissions(t){t.forEach(e=>{const r=new URL(window.location.href);r.searchParams.forEach((n,a)=>{r.searchParams.delete(a)}),r.searchParams.append("my-account-open",!0),r.searchParams.append("form_id",e.getAttribute("id"));const o=e.querySelector('input[name="return_to"]'),s=e.querySelector('input[name="return_url"]');o&&(o.value=r.pathname+r.search),s&&(s.value=r.pathname+r.search),e.addEventListener("submit",n=>{n.preventDefault(),e.querySelectorAll('button[type="submit"]').forEach(a=>{a.disabled=!0;const i=a.querySelector("[data-loader]");i&&(i.hidden=!1)}),Shopify.captcha.protect(e,()=>{e.submit()})})})}_setupEmailBasedAuth(){this._handleEmailSubmitForm(),this._handleInputCodeGroup(),this.tryAnotherEmailButton.addEventListener("click",()=>{this._resetToEmailInput()}),this.sendAnotherCodeButton.addEventListener("click",()=>{this._resendVerificationCode()})}_resetToEmailInput(){this.signInBlock.removeAttribute("hidden"),this.verifyCodeBlock.setAttribute("hidden","");const t=this.signInBlock.querySelector("sl-input");t.value="",t.focus(),this.inputtedEmail="",this.inputtedCode="",this.acceptsMarketing=!1}_resendVerificationCode(){this._submitEmailForm(this.querySelector("[data-sign-in-form]")),l.notify("Another code has been sent to your email.")}async _handleEmailSubmitForm(){await Promise.all([customElements.whenDefined("sl-input")]).then(()=>{const t=this.querySelector("[data-sign-in-form]"),e=this.querySelector("[data-email-error]");t.addEventListener("sl-invalid",r=>{r.preventDefault(),e.textContent=r.target.validationMessage,e.hidden=!1,r.target.focus()},{capture:!0}),t.addEventListener("submit",r=>{r.preventDefault(),e.hidden=!0,e.textContent="",this._submitEmailForm(t).then(()=>{const o=this.verifyCodeBlock.querySelector(".code-input");o&&o.focus()})})})}async _submitEmailForm(t){const e=t.querySelector('button[type="submit"]');e.disabled=!0,e.querySelector("[data-loader]").hidden=!1;const r=new FormData(t);this.inputtedEmail=r.get("email"),r.has("accepts_marketing")&&(this.acceptsMarketing=r.get("accepts_marketing"));let o="";const s=await this._fetchCaptchaToken();s&&(o=s);try{const n=await this._request({customerEmail:this.inputtedEmail,token:o},c.ENDPOINTS.AUTH.SIGN_IN);if(n.error){console.error(n.error);return}const a=this.querySelector("[data-code-sent-to]");return a&&(a.textContent=this.inputtedEmail),this.signInBlock.setAttribute("hidden",""),this.verifyCodeBlock.removeAttribute("hidden"),n}catch(n){console.error(n),alert("An error occurred. Please try again later.")}finally{e.disabled=!1,e.querySelector("[data-loader]").hidden=!0}}async _submitVerificationCode(){var n,a;const t=this.querySelector(".gw-verify-code__actions"),e=t.querySelectorAll("button, a"),r=t.querySelector("[data-verify-error]"),o=t.querySelector("[data-loader]"),s=this.querySelectorAll("input.code-input");try{s.forEach(u=>{u.disabled=!0}),e.forEach(u=>{u.disabled=!0,u.hidden=!0}),r.hidden=!0,o.hidden=!1;const i=await this._request({customerEmail:this.inputtedEmail,code:this.inputtedCode,is_marketing:this.acceptsMarketing},c.ENDPOINTS.AUTH.VERIFY_CODE);if(!i.url)throw new Error("Verification failed");localStorage.setItem(c.STORAGE_KEYS.TOKEN,i.token),localStorage.setItem(c.STORAGE_KEYS.EMAIL,this.inputtedEmail);const d=await fetch(i.url);if(d.error)throw new Error(d.error);const f=await(await fetch(window.location.href)).text(),h=new DOMParser().parseFromString(f,"text/html"),m=(a=(n=h.querySelector("#gw-customer-accounts-template").content)==null?void 0:n.querySelector("gw-integrations-loyalty-points"))==null?void 0:a.getAttribute("page-url");document.documentElement.innerHTML=h.documentElement.innerHTML,document.dispatchEvent(new CustomEvent("gw-customer-accounts:login"));const p=sessionStorage.getItem(c.STORAGE_KEYS.REDIRECT_URL);if(p&&(sessionStorage.removeItem(c.STORAGE_KEYS.REDIRECT_URL),window.location.href=p),!m)return;window.location.pathname.includes(m)&&window.location.reload()}catch(i){console.error(i),setTimeout(()=>{s[s.length-1].focus()})}finally{s.forEach(i=>{i.disabled=!1}),e.forEach(i=>{i.disabled=!1,i.hidden=!1}),r.hidden=!1,o.hidden=!0}}async _request(t,e,r="POST"){return await(await fetch(l.baseURL+e,{method:r,body:JSON.stringify(t),mode:"cors",cache:"no-cache",headers:{"Content-Type":"application/json"}})).json()}_handleInputCodeGroup(){const t=[...this.querySelectorAll("input.code-input")];t.forEach((e,r)=>{e.addEventListener("keydown",o=>{(o.ctrlKey||o.metaKey)&&o.keyCode===86||(o.keyCode!==8&&(o.keyCode<48||o.keyCode>57)&&o.preventDefault(),o.keyCode===8&&o.target.value===""&&t[Math.max(0,r-1)].focus())}),e.addEventListener("input",o=>{const[s,...n]=o.target.value;o.target.value=s??"";const a=r===t.length-1,i=s!==void 0;i&&!a&&(t[r+1].focus(),t[r+1].value=n.join(""),t[r+1].dispatchEvent(new Event("input"))),i&&a&&t.every(d=>d.value)&&(this.inputtedCode=t.map(d=>d.value).join(""),this._submitVerificationCode())})})}async _fetchCaptchaToken(){const e=await(await fetch(l.baseURL+c.ENDPOINTS.AUTH.GET_CAPTCHA_TOKEN)).json();return e==null?void 0:e.token}});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gw-customer-accounts",
-  "version": "1.4.0",
+  "version": "1.4.2",
   "description": "",
   "main": "gw-customer-accounts.js",
   "type": "module",

package/src/scripts/components/sign-in.js

@@ -85,7 +85,12 @@ customElements.define(
     _showPasswordResetMessage(form) {
       const errorMessageContainer = form.querySelector('[data-forgot-password-error-message]');
       if (errorMessageContainer) {
-        errorMessageContainer.textContent = 'If we find your account in our system, you will receive a password reset link to your email address.';
+        errorMessageContainer.textContent = "We've sent you an email to reset your password";
+      };
+
+      const forgotPasswordSubtext = form.querySelector('[data-forgot-password-subtext]');
+      if (forgotPasswordSubtext) {
+        forgotPasswordSubtext.remove();
       };
     }
 
@@ -137,8 +142,14 @@ customElements.define(
     _setupFormSubmissions(formList) {
       formList.forEach((form) => {
         const returnUrl = new URL(window.location.href);
+
+        // Remove all query params from the return_url
+        returnUrl.searchParams.forEach((value, key) => {
+          returnUrl.searchParams.delete(key);
+        });
+
         returnUrl.searchParams.append('my-account-open', true);
-        returnUrl.searchParams.append('form_id', form.getAttribute('id'));
+        returnUrl.searchParams.append('form_id', form.getAttribute('id')); // Add form_id back to the return_url
 
         // Update return_to input value
         const returnToInput = form.querySelector('input[name="return_to"]');