import{o as K,c as O,e as R,a as F,p as l,v as x,g as D,B as G,q as z,i as o,b as A,d as H,w as J,f as j,l as N,m as d,t as Q,u as B,r as T}from"../../custom-element.js";import{e as U}from"../../each.js";import{a as V,r as W,s as I,e as X}from"../../attributes.js";import{b as E}from"../../this.js";var Y=j('<input class="mc-pincode-input__control svelte-h63szf" type="text" inputmode="numeric" maxlength="1" pattern="\\d*" autocomplete="one-time-code"/>'),Z=j("<div></div>");const $={hash:"svelte-h63szf",code:`/**
 * Do not edit directly, this file was auto-generated.
 */.mc-pincode-input.svelte-h63szf {display:inline-flex;column-gap:0.5rem;}
@media screen and (width <= 1024px) {.mc-pincode-input.svelte-h63szf {flex-wrap:wrap;row-gap:0.75rem;}
}.mc-pincode-input__control.svelte-h63szf {font-size:var(--font-size-400, 1.75rem);transition:box-shadow 200ms ease;background-color:var(--forms-color-background-default, #ffffff);border:var(--border-width-s, 0.0625rem) solid var(--forms-color-border-default, #666666);border-radius:var(--forms-border-radius, 0.25rem);transition:all ease 200ms;color:var(--forms-color-text-default, #000000);display:block;width:3rem;box-sizing:border-box;height:4rem;text-align:center;line-height:var(--line-height-s, 1.3);}.mc-pincode-input__control.svelte-h63szf::placeholder {color:var(--forms-color-placeholder, #666666);}.mc-pincode-input__control.svelte-h63szf:focus-within {box-shadow:0 0 0 0.125rem var(--focus-color-mid, var(--focus-color-outline-mid, #ffffff)), 0 0 0 0.25rem var(--focus-color-outer, var(--focus-color-outline-outer, #000000));outline:0.125rem solid transparent;outline-offset:0.125rem;}.mc-pincode-input__control.svelte-h63szf:hover:not(:focus-within) {border-color:var(--forms-color-border-hover, #4d4d4d);box-shadow:0 0 0 var(--border-width-s, 0.0625rem) var(--forms-color-border-hover, #4d4d4d);}.mc-pincode-input__control.svelte-h63szf:disabled {background-color:var(--forms-color-background-disabled, #d9d9d9);cursor:not-allowed;border-color:transparent;box-shadow:none;color:var(--forms-color-text-disabled, #737373);pointer-events:none;}.mc-pincode-input__control.is-invalid.svelte-h63szf {border-color:var(--forms-color-border-invalid, #ea302d);box-shadow:0 0 0 var(--border-width-s, 0.0625rem) var(--forms-color-border-invalid, #ea302d);}.mc-pincode-input__control.is-invalid.svelte-h63szf:hover:not(:focus-within) {border-color:var(--forms-color-border-invalid-hover, #c61112);box-shadow:0 0 0 var(--border-width-s, 0.0625rem) var(--forms-color-border-invalid-hover, #c61112);}`};function ee(k,s){R(s,!0),F(k,$);let p=l(s,"id",7),c=l(s,"length",7,6),h=l(s,"name",7),b=l(s,"value",15),g=l(s,"isinvalid",7),m=l(s,"disabled",7),v=l(s,"readonly",7),q=N(s,["$$slots","$$events","$$legacy","$$host","id","length","name","value","isinvalid","disabled","readonly"]);const n=J(()=>typeof c()=="string"?parseInt(c(),10)||6:c());let i=x(D([])),_=x(D([])),y;G(()=>{const e=String(b()??"");z(i,Array(o(n)).fill(""),!0),z(i,Array.from({length:o(n)},(t,r)=>e[r]??""),!0)});const u=e=>{queueMicrotask(()=>o(_)?.[e]?.focus())},w=()=>{const e=o(i).join(""),t=new CustomEvent("input",{detail:{value:e},bubbles:!0,composed:!0});y.dispatchEvent(t)},L=(e,t)=>{const a=e.target.value.replace(/\D/g,"").slice(0,1);o(i)[t]=a,w(),a&&t+1<o(n)&&u(t+1)},M=(e,t)=>{e.key==="ArrowLeft"&&t>0?(e.preventDefault(),u(t-1)):e.key==="ArrowRight"&&t<o(n)-1?(e.preventDefault(),u(t+1)):e.key==="Backspace"&&o(i)[t]===""&&t>0&&(o(i)[t-1]="",w(),u(t-1))},P=e=>{e.preventDefault();const t=(e.clipboardData?.getData("text")??"").replace(/\D/g,"").slice(0,o(n));z(i,Array.from({length:o(n)},(r,a)=>t[a]??""),!0),w(),u(Math.min(t.length,o(n)-1))};var S={get id(){return p()},set id(e){p(e),d()},get length(){return c()},set length(e=6){c(e),d()},get name(){return h()},set name(e){h(e),d()},get value(){return b()},set value(e){b(e),d()},get isinvalid(){return g()},set isinvalid(e){g(e),d()},get disabled(){return m()},set disabled(e){m(e),d()},get readonly(){return v()},set readonly(e){v(e),d()}},f=Z();return V(f,()=>({class:{"mc-pincode-input":!0,"mc-pincode-input__disabled":m(),"mc-pincode-input__readonly":v(),"is-invalid":g()},onpaste:P,...q}),void 0,void 0,void 0,"svelte-h63szf"),U(f,20,()=>[...Array(o(n)).keys()],e=>e,(e,t)=>{var r=Y();W(r),E(r,(a,C)=>o(_)[C]=a,a=>o(_)?.[a],()=>[t]),Q(()=>{I(r,"id",`pincodeItem${t}`),I(r,"name",h()??`pincode-${p()}`),r.disabled=m(),r.readOnly=v(),X(r,o(i)[t])}),B("input",r,a=>L(a,t)),B("keydown",r,a=>M(a,t)),A(e,r)}),T(f),E(f,e=>y=e,()=>y),A(k,f),H(S)}K(["input","keydown"]);customElements.define("m-pincode",O(ee,{isinvalid:{attribute:"isinvalid",reflect:!0,type:"Boolean"},disabled:{attribute:"disabled",reflect:!0,type:"Boolean"},readonly:{attribute:"readonly",reflect:!0,type:"Boolean"},id:{},length:{},name:{},value:{}},[],[],{mode:"open"}));
//# sourceMappingURL=Pincode.js.map
