JezK

Edit File: sc-customer-email.js

import{proxyCustomElement,HTMLElement,createEvent,h,Fragment}from"@stencil/core/internal/client";import{s as speak}from"./index2.js";import{a as apiFetch}from"./index4.js";import{d as createOrUpdateCheckout}from"./index5.js";import{b as getValueFromUrl,c as isRateLimited}from"./util.js";import{r as resendAnchorFrom,g as getBlockedDuplicateSeconds,d as defineCustomElement$c}from"./sc-customer-login2.js";import{s as state$1,C as CODE_SENT,o as onChange$1,U as UNVERIFIED,r as resetUser,V as VERIFYING,a as CODE_EXPIRED}from"./store2.js";import{s as state,o as onChange}from"./mutations2.js";import{d as defineCustomElement$e}from"./sc-avatar2.js";import{d as defineCustomElement$d}from"./sc-button2.js";import{d as defineCustomElement$b}from"./dropdown.js";import{d as defineCustomElement$a}from"./sc-flex2.js";import{d as defineCustomElement$9}from"./sc-form-control2.js";import{d as defineCustomElement$8}from"./sc-icon2.js";import{d as defineCustomElement$7}from"./sc-input2.js";import{d as defineCustomElement$6}from"./sc-menu2.js";import{d as defineCustomElement$5}from"./sc-menu-item2.js";import{d as defineCustomElement$4}from"./sc-spinner2.js";import{d as defineCustomElement$3}from"./sc-verification-code2.js";import{d as defineCustomElement$2}from"./sc-visually-hidden2.js";const scCustomerEmailCss=":host{display:block;position:relative}a{color:var(--sc-color-primary-500)}.email-preview{display:flex;align-items:center;justify-content:space-between;position:relative;width:100%;box-sizing:border-box;font-family:var(--sc-input-font-family);font-weight:var(--sc-input-font-weight);letter-spacing:var(--sc-input-letter-spacing);background-color:var(--sc-input-background-color);border:solid 1px var(--sc-input-border-color, var(--sc-input-border));vertical-align:middle;box-shadow:var(--sc-input-box-shadow);transition:var(--sc-input-transition, var(--sc-transition-medium)) color, var(--sc-input-transition, var(--sc-transition-medium)) border, var(--sc-input-transition, var(--sc-transition-medium)) box-shadow;border-radius:var(--sc-input-border-radius-medium);padding:var(--sc-input-spacing-small);font-size:var(--sc-font-size-small)}.email-preview sc-avatar{--sc-avatar-size:38px}.email-preview__info{display:flex;align-items:center;gap:1em}.email-preview__text{line-height:var(--sc-line-height-dense)}.email-preview__text :last-child:not(:first-child){color:var(--sc-input-help-text-color)}.email-preview__name{font-weight:var(--sc-font-weight-bold)}a.customer-email__login-link{color:var(--sc-customer-login-link-color, var(--sc-input-placeholder-color));text-decoration:none;font-size:var(--sc-font-size-small)}.tracking-confirmation-message{font-size:var(--sc-font-size-xx-small)}.tracking-confirmation-message span{opacity:0.75}.account-loader{line-height:0}",ScCustomerEmailStyle0=scCustomerEmailCss,ScCustomerEmail$1=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this.__attachShadow(),this.scChange=createEvent(this,"scChange",7),this.scClear=createEvent(this,"scClear",7),this.scInput=createEvent(this,"scInput",7),this.scFocus=createEvent(this,"scFocus",7),this.scBlur=createEvent(this,"scBlur",7),this.scUpdateOrderState=createEvent(this,"scUpdateOrderState",7),this.scUpdateAbandonedCart=createEvent(this,"scUpdateAbandonedCart",7),this.scLoginPrompt=createEvent(this,"scLoginPrompt",7),this.trackingConfirmationMessage=void 0,this.size="medium",this.value=getValueFromUrl("email"),this.pill=!1,this.label=void 0,this.showLabel=!0,this.help="",this.placeholder=void 0,this.disabled=!1,this.readonly=!1,this.required=!1,this.invalid=!1,this.autofocus=void 0,this.hasFocus=void 0,this.busy=void 0,this.logoutBusy=!1,this.error="",this.loginMode="code"}async handleChange(){this.value=this.input.value,this.scChange.emit();try{state.checkout=await createOrUpdateCheckout({id:state.checkout.id,data:{email:this.input.value}})}catch(e){console.log(e)}finally{this.busy=!1}}handleValueChange(){this.loginCodeDebounce&&clearTimeout(this.loginCodeDebounce),this.loginCodeDebounce=window.setTimeout((()=>{this.createLoginCode(),this.loginCodeDebounce=null}),800)}async createLoginCode(){if(this.value&&!state$1.loggedIn&&state.showLoginPrompt&&/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(this.value))try{this.busy=!0,this.error="",this.loginMode="code";const e=await apiFetch({method:"POST",path:"surecart/v1/verification_codes",data:{login:this.value,checkout_mode:state.mode}});state$1.email=this.value,state$1.verificationStatus=CODE_SENT,state$1.resendAvailableAt=resendAnchorFrom(null==e?void 0:e.resend_available_in),!1===(null==e?void 0:e.email_sent)?speak(wp.i18n.__("A verification code was already sent to your email. Please check your email.","surecart"),"assertive"):speak(wp.i18n.__("Verification code is sent to your email. Please check your email.","surecart"),"assertive")}catch(e){this.handleCodeSendError(e)}finally{this.busy=!1}}async reportValidity(){var e,t;return!!state$1.loggedIn||(null===(t=null===(e=this.input)||void 0===e?void 0:e.reportValidity)||void 0===t?void 0:t.call(e))}handleSessionChange(){var e,t,s,i,a,o;if(this.value&&!state$1.loggedIn)return;if(state$1.loggedIn)return void(this.value=state$1.email||(null===(t=null===(e=null==state?void 0:state.checkout)||void 0===e?void 0:e.customer)||void 0===t?void 0:t.email)||(null===(s=null==state?void 0:state.checkout)||void 0===s?void 0:s.email));const n=getValueFromUrl("email");state$1.loggedIn||!n?(this.value=(null===(i=null==state?void 0:state.checkout)||void 0===i?void 0:i.email)||(null===(o=null===(a=null==state?void 0:state.checkout)||void 0===a?void 0:a.customer)||void 0===o?void 0:o.email),this.value&&!state$1.loggedIn&&(state$1.email=this.value)):this.value=n}componentWillLoad(){this.handleSessionChange(),this.removeCheckoutListener=onChange("checkout",(()=>this.handleSessionChange())),this.removeUserListener=onChange$1("email",(e=>{this.value=e}))}handleCodeSendError(e){var t;if(isRateLimited(e))return state$1.email=(null===(t=this.input)||void 0===t?void 0:t.value)||"",state$1.verificationStatus=UNVERIFIED,void(this.loginMode="password");const s=getBlockedDuplicateSeconds(e);((null==e?void 0:e.additional_errors)||[]).forEach((e=>{var t;"verification_code.email.blocked_duplicate"===(null==e?void 0:e.code)?(state$1.email=(null===(t=this.input)||void 0===t?void 0:t.value)||"",state$1.verificationStatus=CODE_SENT,state$1.resendAvailableAt=resendAnchorFrom(s)):this.error=(null==e?void 0:e.message)||wp.i18n.__("Verification code is not valid. Please try again.","surecart")}))}disconnectedCallback(){this.removeCheckoutListener(),this.removeUserListener()}async logout(){try{this.logoutBusy=!0,state.checkout=await createOrUpdateCheckout({id:state.checkout.id,data:{email:""}});const e=await apiFetch({method:"POST",path:"surecart/v1/logout"});(null==e?void 0:e.nonce)&&apiFetch.nonceMiddleware&&(apiFetch.nonceMiddleware.nonce=e.nonce),resetUser(),speak(wp.i18n.__("Logged out successfully.","surecart"),"assertive")}catch(e){console.error(e)}finally{this.logoutBusy=!1}}renderLoggedIn(){return h("div",{class:"email-preview"},h("div",{class:"email-preview__info"},h("sc-avatar",{image:state$1.avatarUrl,initials:((null==state$1?void 0:state$1.name)||(null==state$1?void 0:state$1.email)).charAt(0)}),h("div",{class:"email-preview__text"},h("div",{class:"email-preview__name"},state$1.name),h("div",{class:"email-preview__email"},state$1.email))),h("sc-dropdown",{placement:"bottom-end"},h("sc-button",{type:"text",slot:"trigger",loading:this.logoutBusy},h("sc-icon",{name:"chevron-down","aria-label":wp.i18n.__("Account options","surecart")})),h("sc-menu",null,h("sc-menu-item",{onClick:()=>this.logout()},h("sc-icon",{slot:"prefix",name:"log-out"}),wp.i18n.__("Logout","surecart")))))}renderOptIn(){return this.trackingConfirmationMessage?!1!==state.abandonedCheckoutEnabled?h("div",{class:"tracking-confirmation-message"},h("span",null,this.trackingConfirmationMessage)," ",h("a",{href:"#",onClick:e=>{e.preventDefault(),this.scUpdateAbandonedCart.emit(!1)}},wp.i18n.__("No Thanks","surecart"))):h("div",{class:"tracking-confirmation-message"},h("span",null," ",wp.i18n.__("You won't receive further emails from us.","surecart"))):null}render(){var e;return state$1.loggedIn?this.renderLoggedIn():state$1.verificationStatus===CODE_SENT||state$1.verificationStatus===VERIFYING||state$1.verificationStatus===UNVERIFIED||state$1.verificationStatus===CODE_EXPIRED?h("sc-customer-login",{initialMode:this.loginMode,codeError:this.error}):h(Fragment,null,h("sc-input",{exportparts:"base, input, form-control, label, help-text, prefix, suffix",type:"email",name:"email",ref:e=>this.input=e,value:this.value,help:this.help,label:this.label,autocomplete:"email",placeholder:this.placeholder,disabled:this.disabled||!!state$1.loggedIn&&!!(null===(e=this.value)||void 0===e?void 0:e.length)&&!this.invalid,readonly:this.readonly,required:!0,invalid:this.invalid,autofocus:this.autofocus,hasFocus:this.hasFocus,onScChange:()=>this.handleChange(),onScInput:()=>{this.scInput.emit()},onScFocus:()=>this.scFocus.emit(),onScBlur:()=>this.scBlur.emit()},this.busy&&h("sc-spinner",{slot:"suffix",class:"account-loader"})),this.renderOptIn())}static get watchers(){return{value:["handleValueChange"]}}static get style(){return ScCustomerEmailStyle0}},[1,"sc-customer-email",{trackingConfirmationMessage:[1,"tracking-confirmation-message"],size:[513],value:[1025],pill:[516],label:[1],showLabel:[4,"show-label"],help:[1],placeholder:[1],disabled:[516],readonly:[516],required:[516],invalid:[1540],autofocus:[4],hasFocus:[1540,"has-focus"],busy:[32],logoutBusy:[32],error:[32],loginMode:[32],reportValidity:[64]},void 0,{value:["handleValueChange"]}]);function defineCustomElement$1(){"undefined"!=typeof customElements&&["sc-customer-email","sc-avatar","sc-button","sc-customer-login","sc-dropdown","sc-flex","sc-form-control","sc-icon","sc-input","sc-menu","sc-menu-item","sc-spinner","sc-verification-code","sc-visually-hidden"].forEach((e=>{switch(e){case"sc-customer-email":customElements.get(e)||customElements.define(e,ScCustomerEmail$1);break;case"sc-avatar":customElements.get(e)||defineCustomElement$e();break;case"sc-button":customElements.get(e)||defineCustomElement$d();break;case"sc-customer-login":customElements.get(e)||defineCustomElement$c();break;case"sc-dropdown":customElements.get(e)||defineCustomElement$b();break;case"sc-flex":customElements.get(e)||defineCustomElement$a();break;case"sc-form-control":customElements.get(e)||defineCustomElement$9();break;case"sc-icon":customElements.get(e)||defineCustomElement$8();break;case"sc-input":customElements.get(e)||defineCustomElement$7();break;case"sc-menu":customElements.get(e)||defineCustomElement$6();break;case"sc-menu-item":customElements.get(e)||defineCustomElement$5();break;case"sc-spinner":customElements.get(e)||defineCustomElement$4();break;case"sc-verification-code":customElements.get(e)||defineCustomElement$3();break;case"sc-visually-hidden":customElements.get(e)||defineCustomElement$2()}}))}const ScCustomerEmail=ScCustomerEmail$1,defineCustomElement=defineCustomElement$1;export{ScCustomerEmail,defineCustomElement};