primevue/inputotp/inputotp.esm.min.js

PrimeVue is an open source UI library for Vue featuring a rich set of 80+ components, a theme designer, various theme alternatives such as Material, Bootstrap, Tailwind, premium templates and professional support. In addition, it integrates with PrimeBloc

import t from"primevue/inputtext";import e from"primevue/basecomponent";import n from"primevue/inputotp/style";import{resolveComponent as o,openBlock as i,createElementBlock as u,mergeProps as r,Fragment as a,renderList as s,renderSlot as l,createVNode as p,normalizeClass as d}from"vue";var c={name:"InputOtp",extends:{name:"BaseInputOtp",extends:e,props:{modelValue:{type:null,default:!1},invalid:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},readonly:{type:Boolean,default:!1},variant:{type:String,default:null},tabindex:{type:Number,default:null},length:{type:Number,default:4},mask:{type:Boolean,default:!1},integerOnly:{type:Boolean,default:!1}},style:n,provide:function(){return{$parentInstance:this}}},inheritAttrs:!1,emits:["update:modelValue","change","focus","blur"],data:function(){return{tokens:[]}},watch:{modelValue:{immediate:!0,handler:function(t){this.tokens=t?t.split(""):new Array(this.length)}}},methods:{getTemplateAttrs:function(t){return{value:this.tokens[t]}},getTemplateEvents:function(t){var e=this;return{input:function(n){return e.onInput(n,t)},keydown:function(t){return e.onKeyDown(t)},focus:function(t){return e.onFocus(t)},blur:function(t){return e.onBlur(t)},paste:function(t){return e.onPaste(t)}}},getPTOptions:function(t){return("root"===t?this.ptmi:this.ptm)(t,{context:{checked:this.checked,disabled:this.disabled}})},onInput:function(t,e){this.tokens[e]=t.target.value,this.updateModel(t),"deleteContentBackward"===t.inputType?this.moveToPrev(t):"insertText"!==t.inputType&&"deleteContentForward"!==t.inputType||this.moveToNext(t)},updateModel:function(t){var e=this.tokens.join("");this.$emit("update:modelValue",e),this.$emit("change",{originalEvent:t,value:e})},moveToPrev:function(t){var e=this.findPrevInput(t.target);e&&(e.focus(),e.select())},moveToNext:function(t){var e=this.findNextInput(t.target);e&&(e.focus(),e.select())},findNextInput:function(t){var e=t.nextElementSibling;if(e)return"INPUT"===e.nodeName?e:this.findNextInput(e)},findPrevInput:function(t){var e=t.previousElementSibling;if(e)return"INPUT"===e.nodeName?e:this.findPrevInput(e)},onFocus:function(t){t.target.select(),this.$emit("focus",t)},onBlur:function(t){this.$emit("blur",t)},onKeyDown:function(t){switch(t.keyCode){case 37:this.moveToPrev(t),t.preventDefault();break;case 38:case 40:case 40:t.preventDefault();break;case 8:0===t.target.value.length&&(this.moveToPrev(t),t.preventDefault());break;case 39:this.moveToNext(t),t.preventDefault();break;default:!this.integerOnly||t.keyCode>=48&&t.keyCode<=57||t.preventDefault()}},onPaste:function(t){var e=t.clipboardData.getData("text");if(e.length){var n=e.substring(0,this.length+1);this.isIntegerOnly&&isNaN(n)||(this.tokens=n.split(""),this.updateModel(t))}t.preventDefault()}},computed:{inputMode:function(){return this.integerOnly?"number":"text"},inputType:function(){return this.mask?"password":"text"}},components:{OtpInputText:t}};c.render=function(t,e,n,c,f,v){var m=o("OtpInputText");return i(),u("div",r({class:t.cx("root")},t.ptmi("root")),[(i(!0),u(a,null,s(t.length,(function(n){return l(t.$slots,"default",{key:n,events:v.getTemplateEvents(n-1),attrs:v.getTemplateAttrs(n-1),index:n},(function(){return[p(m,{value:f.tokens[n-1],type:v.inputType,class:d(t.cx("input")),inputmode:v.inputMode,variant:t.variant,readonly:t.readonly,disabled:t.disabled,invalid:t.invalid,tabindex:t.tabindex,unstyled:t.unstyled,onInput:function(t){return v.onInput(t,n-1)},onFocus:e[0]||(e[0]=function(t){return v.onFocus(t)}),onBlur:e[1]||(e[1]=function(t){return v.onBlur(t)}),onPaste:e[2]||(e[2]=function(t){return v.onPaste(t)}),onKeydown:e[3]||(e[3]=function(t){return v.onKeyDown(t)}),pt:t.ptm("input")},null,8,["value","type","class","inputmode","variant","readonly","disabled","invalid","tabindex","unstyled","onInput","pt"])]}))})),128))],16)};export{c as default};