import{Ct as e,H as t,I as n,L as r,N as i,P as a,Q as o,S as s,V as c,_ as l,b as u,bt as d,c as f,d as p,g as m,lt as h,mt as g,nt as _,v,w as y,x as b,z as x}from"./vue.runtime.esm-bundler-DQjudA8G.js";import{t as S}from"./utils-BB02OBq2.js";import{S as C,m as w}from"./dist-t_U6YImb.js";import{t as T}from"./createContext-BefgL9WT.js";import{r as E,t as D}from"./useForwardPropsEmits-ixfQllIc.js";import{t as O}from"./Primitive-jhoGcsVx.js";import{t as k}from"./useArrowNavigation-Cq05LxDE.js";import{t as A}from"./useForwardProps-B-1JXcFn.js";import{n as j,t as M}from"./usePrimitiveElement-BKQPgqfD.js";import{t as N}from"./useForwardExpose-OKJAPp5E.js";import{t as P}from"./VisuallyHiddenInput-syf01z94.js";import{t as F}from"./Button-2mdP_ygs.js";import{t as I}from"./Card-Cv6HQPiQ.js";import{t as L}from"./CardContent-cvoMlP3H.js";import{n as R,r as z,t as B}from"./CardHeader-JyQWjCMQ.js";import{t as V}from"./CardFooter-BXCq_TYq.js";import{t as H}from"./auth-title-CWjARZIA.js";var[U,W]=T(`PinInputRoot`),G=y({inheritAttrs:!1,__name:`PinInputRoot`,props:{modelValue:{type:null,required:!1},defaultValue:{type:null,required:!1},placeholder:{type:String,required:!1,default:``},mask:{type:Boolean,required:!1},otp:{type:Boolean,required:!1},type:{type:null,required:!1,default:`text`},dir:{type:String,required:!1},disabled:{type:Boolean,required:!1},id:{type:String,required:!1},asChild:{type:Boolean,required:!1},as:{type:null,required:!1},name:{type:String,required:!1},required:{type:Boolean,required:!1}},emits:[`update:modelValue`,`complete`],setup(n,{emit:r}){let a=n,c=r,{mask:l,otp:u,placeholder:f,type:p,disabled:h,dir:y}=d(a),{forwardRef:b}=N(),S=j(y),C=w(a,`modelValue`,c,{defaultValue:a.defaultValue??[],passive:!0,deep:!0}),T=m(()=>Array.isArray(C.value)?[...C.value]:[]),E=g(new Set);function D(e){E.value.add(e)}let k=m(()=>a.type===`number`),A=m(()=>T.value.filter(e=>!!e||k.value&&e===0).length===E.value.size);return o(C,()=>{A.value&&c(`complete`,C.value)},{deep:!0}),W({modelValue:C,currentModelValue:T,mask:l,otp:u,placeholder:f,type:p,dir:S,disabled:h,isCompleted:A,inputElements:E,onInputElementChange:D,isNumericMode:k}),(n,r)=>(x(),v(e(O),i(n.$attrs,{ref:e(b),dir:e(S),"data-complete":A.value?``:void 0,"data-disabled":e(h)?``:void 0}),{default:_(()=>[t(n.$slots,`default`,{modelValue:e(C)}),s(P,{id:n.id,as:`input`,feature:`focusable`,tabindex:`-1`,value:T.value.join(``),name:n.name??``,disabled:e(h),required:n.required,onFocus:r[0]||=e=>Array.from(E.value)?.[0]?.focus()},null,8,[`id`,`value`,`name`,`disabled`,`required`])]),_:3},16,[`dir`,`data-complete`,`data-disabled`]))}}),K=y({__name:`PinInputInput`,props:{index:{type:Number,required:!0},disabled:{type:Boolean,required:!1},asChild:{type:Boolean,required:!1},as:{type:null,required:!1,default:`input`}},setup(i){let s=i,c=U(),l=m(()=>Array.from(c.inputElements.value)),u=m(()=>c.currentModelValue.value[s.index]),d=m(()=>s.disabled||c.disabled.value),p=m(()=>c.otp.value),h=m(()=>c.mask.value),{primitiveElement:g,currentElement:y}=M();function b(e){let t=e.target;if((e.data?.length??0)>1){N(t.value);return}if(c.isNumericMode.value&&!/^\d*$/.test(t.value)){t.value=t.value.replace(/\D/g,``);return}t.value=e.data||t.value.slice(-1),F(s.index,t.value);let n=l.value[s.index+1];n&&n.focus()}function S(){a(()=>{let e=y.value;e&&(!e.value&&e===E()?e.placeholder=``:e.placeholder=c.placeholder.value)})}function C(e){k(e,E(),void 0,{itemsArray:l.value,focus:!0,loop:!1,arrowKeyOptions:`horizontal`,dir:c.dir.value})}function w(e){if(e.preventDefault(),e.target.value)F(s.index,``);else{let e=l.value[s.index-1];e&&(e.focus(),F(s.index-1,``))}}function T(e){e.key===`Delete`&&(e.preventDefault(),F(s.index,``))}function D(e){if(c.otp.value){let e=l.value.findIndex((e,t)=>c.currentModelValue.value[t]===``||c.currentModelValue.value[t]===void 0);if(e!==-1&&e<s.index){l.value[e].focus();return}}e.target.setSelectionRange(1,1),S()}function A(e){S()}function j(e){e.preventDefault();let t=e.clipboardData;t&&N(t.getData(`text`))}function N(e){let t=[...c.currentModelValue.value],n=e.length>=l.value.length?0:s.index,r=Math.min(n+e.length,l.value.length);for(let i=n;i<r;i++){let r=l.value[i],a=e[i-n];c.isNumericMode.value&&!/^\d*$/.test(a)||(t[i]=a,r.focus())}c.modelValue.value=t,l.value[r]?.focus()}function P(e){let t=e.length-1;for(;t>=0&&e[t]===``;)e.pop(),t--;return e}function F(e,t){let n=[...c.currentModelValue.value];if(c.isNumericMode.value){let r=+t;t===``||isNaN(r)?delete n[e]:n[e]=r}else n[e]=t;c.modelValue.value=P(n)}return o(u,S),n(()=>{c.onInputElementChange(y.value)}),r(()=>{c.inputElements?.value.delete(y.value)}),(n,r)=>(x(),v(e(O),{ref_key:`primitiveElement`,ref:g,autocapitalize:`none`,as:n.as,"as-child":n.asChild,autocomplete:p.value?`one-time-code`:`false`,type:h.value?`password`:`text`,inputmode:e(c).isNumericMode.value?`numeric`:`text`,pattern:e(c).isNumericMode.value?`[0-9]*`:void 0,placeholder:e(c).placeholder.value,value:u.value,disabled:d.value,"data-disabled":d.value?``:void 0,"data-complete":e(c).isCompleted.value?``:void 0,"aria-label":`pin input ${n.index+1} of ${l.value.length}`,onInput:r[0]||=e=>b(e),onKeydown:[f(C,[`left`,`right`,`up`,`down`,`home`,`end`]),f(w,[`backspace`]),f(T,[`delete`])],onFocus:D,onBlur:A,onPaste:j},{default:_(()=>[t(n.$slots,`default`)]),_:3},8,[`as`,`as-child`,`autocomplete`,`type`,`inputmode`,`pattern`,`placeholder`,`value`,`disabled`,`data-disabled`,`data-complete`,`aria-label`]))}}),q=y({__name:`PinInput`,props:{modelValue:{},defaultValue:{},placeholder:{},mask:{type:Boolean},otp:{type:Boolean,default:!0},type:{},dir:{},disabled:{type:Boolean},id:{},asChild:{type:Boolean},as:{},name:{},required:{type:Boolean},class:{type:[Boolean,null,String,Object,Array]}},emits:[`update:modelValue`,`complete`],setup(n,{emit:r}){let a=n,o=r,s=D(C(a,`class`),o);return(n,r)=>(x(),v(e(G),i({otp:a.otp,"data-slot":`pin-input`},e(s),{class:e(S)(`flex items-center gap-2 has-disabled:opacity-50 disabled:cursor-not-allowed`,a.class)}),{default:_(()=>[t(n.$slots,`default`)]),_:3},16,[`otp`,`class`]))}}),J=y({__name:`PinInputGroup`,props:{asChild:{type:Boolean},as:{},class:{type:[Boolean,null,String,Object,Array]}},setup(n){let r=n,a=A(C(r,`class`));return(n,o)=>(x(),v(e(O),i({"data-slot":`pin-input-group`},e(a),{class:e(S)(`flex items-center`,r.class)}),{default:_(()=>[t(n.$slots,`default`)]),_:3},16,[`class`]))}}),Y=y({__name:`PinInputInput`,props:{index:{},disabled:{type:Boolean},asChild:{type:Boolean},as:{},class:{type:[Boolean,null,String,Object,Array]}},setup(t){let n=t,r=A(m(()=>{let{class:e,...t}=n;return t}));return(t,a)=>(x(),v(e(K),i(e(r),{class:e(S)(`relative text-center focus:outline-hidden focus:ring-2 focus:ring-ring focus:relative focus:z-10 flex h-10 w-10 items-center justify-center border-y border-r border-input text-sm transition-all first:rounded-l-md first:border-l last:rounded-r-md`,n.class)}),null,16,[`class`]))}}),X={class:`flex items-center justify-center min-h-screen p-4 min-w-screen`},Z={class:`flex flex-col gap-4`},Q={class:`grid items-center justify-center gap-2`},$=y({__name:`otp`,setup(t){let n=g([]);function r(e){alert(e.join(``))}return(t,i)=>{let a=R,o=z,d=B,f=Y,m=J,g=q,v=L,y=F,S=V,C=I;return x(),u(`div`,X,[l(`main`,Z,[s(H),s(C,{class:`w-full max-w-sm`},{default:_(()=>[s(d,null,{default:_(()=>[s(a,{class:`text-2xl`},{default:_(()=>[...i[1]||=[b(` Two-Factor Authentication `,-1)]]),_:1}),s(o,null,{default:_(()=>[...i[2]||=[b(` Please enter the authentication code.We have sent the authentication code to your email. `,-1)]]),_:1})]),_:1}),s(v,{class:`grid gap-4`},{default:_(()=>[l(`div`,Q,[s(g,{id:`pin-input`,modelValue:e(n),"onUpdate:modelValue":i[0]||=e=>h(n)?n.value=e:null,placeholder:`○`,onComplete:r},{default:_(()=>[i[3]||=l(`span`,{class:`text-xl`},`SA`,-1),i[4]||=l(`span`,null,`-`,-1),s(m,null,{default:_(()=>[(x(),u(p,null,c(6,(e,t)=>s(f,{key:e,index:t},null,8,[`index`])),64))]),_:1})]),_:1},8,[`modelValue`])])]),_:1}),s(S,{class:`flex flex-col gap-2`},{default:_(()=>[s(y,{class:`w-full`,disabled:e(n).length<6},{default:_(()=>[...i[5]||=[b(` Verify `,-1)]]),_:1},8,[`disabled`]),s(o,null,{default:_(()=>[i[7]||=b(` Haven't received it? `,-1),s(y,{variant:`link`,class:`px-0 text-muted-foreground`},{default:_(()=>[...i[6]||=[b(` Resend a new code. `,-1)]]),_:1})]),_:1})]),_:1})]),_:1})])])}}});export{$ as default};