JezK

Edit File: 8839.js

"use strict";(self.webpackChunk_surecart_surecart=self.webpackChunk_surecart_surecart||[]).push([[8839],{68839:function(e,t,i){i.r(t),i.d(t,{sc_verification_code:function(){return l}});var o=i(10467),n=i(89394),c=i(23029),r=i(92901),s=i(89280),a=i.n(s),u=i(27364),l=function(){return(0,r.A)((function e(t){var i=this;(0,c.A)(this,e),(0,u.r)(this,t),this.filledAllInputs=function(){return i.codes.join("").trim().length===i.total},this.total=6,this.codes=Array(this.total).fill(""),this.loading=!1,this.onChange=void 0}),[{key:"handleKeyDown",value:function(e,t){"Backspace"!==e.key&&"Delete"!==e.key||(e.preventDefault(),this.getElementByIndex(t).value="",this.codes=[].concat((0,n.A)(this.codes.slice(0,t)),[""],(0,n.A)(this.codes.slice(t+1))),t>0&&this.focusInput(t-1))}},{key:"handleInput",value:function(e,t){var i=e.target.value;if(i.length>1){for(var o=(0,n.A)(this.codes),c=0;c<this.total-t&&c<i.length;c++){var r=this.getElementByIndex(t+c);r.blur(),r.value=i[c],o[t+c]=i[c]}this.codes=o,t=t+i.length-1,i=i[i.length-1]}t<this.codes.length&&(this.codes=[].concat((0,n.A)(this.codes.slice(0,t)),[i],(0,n.A)(this.codes.slice(t+1)))),t<this.codes.length-1&&i.length>0&&this.focusInput(t+1),t===this.codes.length-1&&i.length>0&&this.getElementByIndex(t).blur(),this.filledAllInputs()&&this.handleCodeChange()}},{key:"handleCodeChange",value:function(){var e=(this.codes.join("")||"").trim();e.length===this.total&&this.onChange(e)}},{key:"focusInput",value:function(e){var t=this.getElementByIndex(e);t&&(t.focus(),t.select())}},{key:"triggerFocus",value:(e=(0,o.A)(a().mark((function e(){return a().wrap((function(e){for(;;)switch(e.prev=e.next){case 0:this.focusInput(0);case 1:case"end":return e.stop()}}),e,this)}))),function(){return e.apply(this,arguments)})},{key:"getElementByIndex",value:function(e){return this.el.querySelector("#code-input-".concat(e))}},{key:"handleFocus",value:function(e){e.target.select()}},{key:"reset",value:function(){var e;this.codes=Array(this.total).fill(""),null===(e=this.getElementByIndex(0))||void 0===e||e.focus()}},{key:"render",value:function(){var e=this;return(0,u.h)("div",{key:"74f453ffcdab58d6a165ec948e152989740fc124",class:"sc-verification-code"},Array.from({length:this.total}).map((function(t,i){return(0,u.h)(u.F,null,i===Math.floor(e.total/2)&&(0,u.h)("span",{class:"sc-verification-code__separator","aria-hidden":"true"},"—"),(0,u.h)("input",{key:i,id:"code-input-".concat(i),value:e.codes[i]?e.codes[i]:"",onInput:function(t){return e.handleInput(t,i)},onKeyDown:function(t){return e.handleKeyDown(t,i)},onFocus:function(t){return e.handleFocus(t)},autocomplete:"one-time-code",inputmode:"numeric",pattern:"[0-9]*",autofocus:0===i,required:!0,"aria-label":wp.i18n.__("Verification code ".concat(i+1," of ").concat(e.total),"surecart")}))})),(0,u.h)("button",{key:"e2ed6ab2f8febea2c529c8bec1744adb377a4b11",type:"submit",class:"visually-hidden",onClick:function(){return e.onChange(e.codes.join(""))}},wp.i18n.__("Submit","surecart")))}},{key:"el",get:function(){return(0,u.a)(this)}}]);var e}();l.style="sc-verification-code{--focus-ring:0 0 0 var(--sc-focus-ring-width) var(--sc-focus-ring-color-primary);display:block}sc-verification-code .sc-verification-code{display:flex;align-items:center;gap:var(--sc-spacing-small);margin-top:var(--sc-spacing-medium);margin-bottom:var(--sc-spacing-medium)}sc-verification-code .sc-verification-code input{flex:1;min-width:0;height:var(--sc-input-height, 48px);max-width:64px;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:1px solid var(--sc-input-border-color, var(--sc-input-border));border-radius:var(--sc-input-border-radius-medium);box-shadow:var(--sc-input-box-shadow);font-size:var(--sc-input-font-size-large);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;cursor:text;text-align:center}sc-verification-code .sc-verification-code input:-webkit-autofill,sc-verification-code .sc-verification-code input:-webkit-autofill:hover,sc-verification-code .sc-verification-code input:-webkit-autofill:focus,sc-verification-code .sc-verification-code input:-webkit-autofill:active{box-shadow:0 0 0 var(--sc-input-height-large) var(--sc-input-background-color-hover) inset !important;-webkit-text-fill-color:var(--sc-input-color)}sc-verification-code .sc-verification-code input::placeholder{color:var(--sc-input-placeholder-color);user-select:none}sc-verification-code .sc-verification-code input:focus{outline:none;background-color:var(--sc-input-background-color-focus);border-color:var(--sc-input-border-color-focus);box-shadow:var(--focus-ring);color:var(--sc-input-color-focus);z-index:8}sc-verification-code .sc-verification-code .sc-verification-code__separator{color:var(--sc-input-help-text-color);font-size:var(--sc-font-size-large);user-select:none;display:flex;align-items:center}sc-verification-code .sc-verification-code .visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0}"}}]);