https://squareup.com/shop/hardware/v2/_next/static/chunks/6610.ee9520fc9bf23501.js

1"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[6610],{66610:function(e,t,o){o.r(t),o.d(t,{market_code_input:function(){return a}});var l=o(54982);let s=`:host,::slotted(*),*{box-sizing:border-box}:host([disabled]){cursor:not-allowed !important;}:host([disabled]) *,:host([disabled]) ::slotted(*){cursor:not-allowed !important;pointer-events:none !important;}:host *{outline-color:var(--core-focus-ring-color)}:host(:focus-visible),::slotted(*:focus-visible){outline:var(--core-focus-ring-border-size) solid var(--core-focus-ring-color);outline-offset:var(--core-focus-ring-buffer-size)}::slotted(a),::slotted(button){border-radius:1px}:host{position:relative;outline:none;font-weight:var(--field-input-weight);font-size:var(--field-input-size);line-height:var(--field-input-leading);cursor:text}:host input,:host ::slotted(input),:host textarea,:host ::slotted(textarea){width:100%;margin:0;padding:0;border:none;background-color:transparent;color:inherit;font-weight:inherit;font-size:inherit;font-family:inherit;line-height:inherit;letter-spacing:inherit;cursor:inherit}:host input,:host ::slotted(input){overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host ::slotted(label){cursor:inherit}:host input:focus,:host ::slotted(input:focus),:host textarea:focus,:host ::slotted(textarea:focus){outline:none}:host input::-moz-placeholder,:host textarea::-moz-placeholder{color:var(--field-placeholder-text-color)}:host input::placeholder,:host textarea::placeholder{color:var(--field-placeholder-text-color)}:host ::slotted(input)::-moz-placeholder,:host ::slotted(textarea)::-moz-placeholder{color:var(--field-placeholder-text-color)}:host ::slotted(input)::placeholder,:host ::slotted(textarea)::placeholder{color:var(--field-placeholder-text-color)}:host([size='small']){font-size:var(--core-type-paragraph-20-size);line-height:var(--core-type-paragraph-20-leading)}:host{border-radius:var(--field-border-radius);background-color:var(--field-normal-state-background-color);color:var(--field-normal-state-input-color)}:host::after{content:"";position:absolute;inset:0;border-radius:var(--field-border-radius);box-shadow:inset 0 0 0 var(--field-border-size) var(--field-normal-state-normal-validity-border-color);pointer-events:none}:host([invalid])::after{box-shadow:inset 0 0 0 var(--field-border-size) var(--field-normal-state-invalid-validity-border-color)}:host(:hover){background-color:var(--field-hover-state-background-color);color:var(--field-hover-state-input-color)}:host(:hover)::after{box-shadow:inset 0 0 0 var(--field-border-size) var(--field-hover-state-normal-validity-border-color)}:host([invalid]:hover)::after{box-shadow:inset 0 0 0 var(--field-border-size) var(--field-hover-state-invalid-validity-border-color)}:host([focused]){color:var(--field-focus-state-input-color)}:host([focused])::after{box-shadow:inset 0 0 0 var(--field-focus-state-border-size)
2        var(--field-focus-state-normal-validity-border-color)}:host([focused][invalid])::after{box-shadow:inset 0 0 0 var(--field-focus-state-border-size) var(--field-focus-state-invalid-validity-border-color)}:host([readonly]:hover)::after{box-shadow:inset 0 0 0 var(--field-border-size) var(--field-normal-state-normal-validity-border-color)}:host([disabled]){background-color:var(--field-disabled-state-background-color) !important;color:var(--field-disabled-state-input-color) !important;cursor:not-allowed !important}:host([disabled])::after{box-shadow:inset 0 0 0 var(--field-border-size) var(--field-disabled-state-border-color) !important}:host([disabled]) ::slotted(.market-accessory),:host([disabled]) ::slotted(img[slot*="accessory"]),:host([disabled]) ::slotted(svg[slot*="accessory"]),:host([disabled]) ::slotted(div[slot*="accessory"]){--field-disabled-state-accessory-opacity:var(--row-disabled-state-leading-accessory-opacity);opacity:var(--field-disabled-state-accessory-opacity)}:host([value=""]) ::slotted(label){color:var(--field-normal-state-empty-phase-label-color)}:host(:not([value=""])) ::slotted(label),:host([value=""][autofilled]) ::slotted(label){color:var(--field-normal-state-float-phase-label-color)}:host(:hover) ::slotted(label){color:var(--field-hover-state-empty-phase-label-color)}:host(:not([value=""]):hover) ::slotted(label),:host([value=""][autofilled]:hover) ::slotted(label){color:var(--field-hover-state-float-phase-label-color)}:host([focused]) ::slotted(label){color:var(--field-focus-state-float-phase-label-color)}:host([value=""][disabled]) ::slotted(label){color:var(--field-disabled-state-empty-phase-label-color)}:host(:not([value=""])[disabled]) ::slotted(label),:host([value=""][autofilled][disabled]) ::slotted(label){color:var(--field-disabled-state-float-phase-label-color)}:host{display:flex;align-items:center;height:var(--input-code-height, 64px)}

2:host input{font-weight:var(--input-code-font-weight, var(--core-type-bold-weight));font-family:var(--core-type-mono-font-family, monospace);text-align:center}:host input:-webkit-autofill,:host input:-webkit-autofill:hover,:host input:-webkit-autofill:focus{box-shadow:0 0 0 calc(var(--input-code-height, 64px) / 2) var(--field-normal-state-background-color) inset}:host input::-moz-placeholder{color:var(--input-code-placeholder-color, var(--core-fill-30-color));font-size:var(--input-code-placeholder-font-size, 24px)}:host input::placeholder{color:var(--input-code-placeholder-color, var(--core-fill-30-color));font-size:var(--input-code-placeholder-font-size, 24px)}.code-input-container{display:flex;justify-content:center;width:100%;height:100%}.code-input-container::before,.code-input-container::after{content:"";flex-basis:100%;pointer-events:none}::slotted([slot="trailing-accessory"]){margin-right:var(--input-code-trailing-accessory-spacing, 12px)}`,a=class{constructor(e){(0,l.r)(this,e),this.marketCodeInputValueChange=(0,l.c)(this,"marketCodeInputValueChange",7),this.type="number",this.name=void 0,this.length=4,this.focused=!1,this.value="",this.readonly=!1,this.invalid=!1,this.disabled=!1,this._code=void 0}valueChangeHandler(e){let t=this.sanitizeValue(e);this.value!==t&&(this.value=t),this.setInputsFromValue(this.value)}setFocus(e=!0){var t;return this.focused=e,e?this.focusFirstEmptyInput():null===(t=this.el.shadowRoot.activeElement)||void 0===t||t.blur(),Promise.resolve()}isNumber(e){return/^\d+$/.test(e)}isValidChar(e){return!/\s/.test(e)&&(["text","password"].includes(this.type)||this.isNumber(e))}focusFirstEmptyInput(){let e;let t=this.el.shadowRoot.querySelectorAll("input");t.forEach(t=>{t.value||e||(e=t)}),e||(e=t[this.length-1]),e.focus()}initCode(e){if(e){if(this._code=e.split(""),this._code.length<this.length){let e=Array.from({length:this.length-this._code.length}).fill("");this._code=[...this._code,...e]}else this._code.length>this.length&&(this._code=this._code.slice(0,this.length))}else this._code=Array.from({length:this.length}).fill("")}sanitizeValue(e){return e.split("").filter(e=>this.isValidChar(e)).join("").slice(0,this.length)}getValueFromInputs(){let e="";return this.el.shadowRoot.querySelectorAll("input").forEach(t=>{e+=t.value}),e}setInputsFromValue(e){let t=this.el.shadowRoot.querySelectorAll("input");t.forEach((t,o)=>{let l=e[o],s=e[o-1];t.value=l||"",0===o||s?t.removeAttribute("tabindex"):t.tabIndex=-1})}spreadChars(e){let{target:t,data:o}=e,l=o||t.value;if(!l)return;let s=this.sanitizeValue(l);s?this.insertChars(t,s.split("")):t.value=""}insertChars(e,t){let{nextElementSibling:o}=e,[l,...s]=t;e.value=l,null==o||o.focus(),o&&s.length>0&&this.insertChars(o,s)}updateValue(){let e=this.value,t=this.sanitizeValue(this.getValueFromInputs());if(e!==t){let{defaultPrevented:o}=this.marketCodeInputValueChange.emit({code:t});o?this.setInputsFromValue(e):this.value=t}}onInput(e){this.spreadChars(e),this.updateValue()}onFocus(e){let{target:t}=e;this.focused=!0,t.value?t.select():this.focusFirstEmptyInput()}onBlur(){this.focused=!1}onKeyDown(e){let{target:t,key:o}=e,{value:l,previousElementSibling:s,nextElementSibling:a}=t;switch(o){case"ArrowLeft":e.preventDefault(),null==s||s.select();break;case"ArrowRight":e.preventDefault(),null==a||a.select();break;case"Backspace":l||null==s||s.select()}}onKeyUp(e){let{target:t}=e,{value:o}=t;o.length>1?this.spreadChars(e):this.isValidChar(o)||(t.value="",t.focus())}onHostClick(){this.el.shadowRoot.activeElement||this.setFocus()}componentWillLoad(){this.valueChangeHandler(this.value),this.initCode(this.value)}render(){let e=[];return this._code.forEach((t,o)=>{let s=this._code[o-1]||0===o?null:-1;e.push((0,l.h)("input",{required:!0,type:"password"===this.type?"password":"text",inputmode:"number"===this.type?"numeric":null,autocomplete:0===o?"one-time-code":null,value:t,maxlength:o===this.length-1?"1":null,readOnly:this.readonly,disabled:this.disabled,placeholder:"●",tabindex:s,onFocus:e=>this.onFocus(e),onBlur:()=>this.onBlur(),onInput:e=>this.onInput(e),onKeyDown:e=>this.onKeyDown(e),onKeyUp:e=>this.onKeyUp(e)}))}),(0,l.h)(l.H,{key:"17cd91b3021a831896b42dc3fd5678a730ba510a",class:"market-code-input",n

2ame:this.name,onClick:()=>this.onHostClick()},(0,l.h)("span",{key:"dad0e72b1940cbc53dc22e40abc179bada03c91b",class:"code-input-container"},e),(0,l.h)("slot",{key:"2afe584000d09d5d276fcec5520ce145166566af",name:"trailing-accessory"}))}get el(){return(0,l.g)(this)}static get watchers(){return{value:["valueChangeHandler"]}}};a.style=s}}]);