@volverjs/ui-vue 0.0.4 → 0.0.5-beta.2

package/dist/components/VvInputText/VvInputText.umd.js

@@ -1 +1 @@
-(function(e,v){typeof exports=="object"&&typeof module<"u"?module.exports=v(require("vue"),require("@vueuse/core"),require("@iconify/vue"),require("nanoid")):typeof define=="function"&&define.amd?define(["vue","@vueuse/core","@iconify/vue","nanoid"],v):(e=typeof globalThis<"u"?globalThis:e||self,e.VvInputText=v(e.vue,e.core,e.vue$1,e.nanoid))})(this,function(e,v,B,re){"use strict";function W(t,n){if(t&&Object.keys(t).length&&n){if(n.indexOf(".")===-1)return t[n];{const o=n.split(".");let r=t;for(let l=0,d=o.length;l<d;++l){if(t==null)return null;r=r[o[l]]}return r}}else return null}function P(t){return(n=>n==null||n===""||Array.isArray(n)&&n.length===0||!(n instanceof Date)&&typeof n=="object"&&Object.keys(n).length===0)(e.unref(t))}function ae(t){return typeof t=="string"||t instanceof String}function k(t){return Array.isArray(t)?t.filter(n=>ae(n)).join(" "):t}function le(t,n){const{invalid:o,valid:r,hint:l,loading:d}=n,{hintLabel:u,modelValue:_,valid:g,validLabel:m,invalid:s,invalidLabel:i,...b}=e.toRefs(t),p=W(b,"loading"),h=W(b,"loadingLabel"),y=e.computed(()=>s.value?!!(s.value&&o||i!=null&&i.value&&Array.isArray(i.value)&&i.value.length>0||i!=null&&i.value&&!P(i)):!1),O=e.computed(()=>!!(u&&u.value||l)),S=e.computed(()=>!!(m&&m.value||r)),C=e.computed(()=>!!(p!=null&&p.value&&d||p!=null&&p.value&&(h!=null&&h.value))),H=e.computed(()=>O.value||S.value||y.value||C.value);return{hasInvalid:y,hasHint:O,hasValid:S,hasLoading:C,HintSlot:{name:"HintSlot",props:{params:{type:Object,default:()=>({})}},setup(T){const N=e.computed(()=>{const A=v.toReactive({hintLabel:u,modelValue:_,valid:g,validLabel:m,invalid:s,invalidLabel:i,loading:p,loadingLabel:h,...T.params});return s!=null&&s.value?(o==null?void 0:o(A))||k(i==null?void 0:i.value)||(u==null?void 0:u.value):g!=null&&g.value?(r==null?void 0:r(A))||k(m==null?void 0:m.value)||(u==null?void 0:u.value):p!=null&&p.value?(d==null?void 0:d(A))||k(h==null?void 0:h.value)||(u==null?void 0:u.value):(l==null?void 0:l(A))||k(u==null?void 0:u.value)||(u==null?void 0:u.value)});return{isVisible:H,hasInvalid:y,hasValid:S,hintContent:N}},render(){if(this.isVisible)return e.h("small",{role:this.hasInvalid?"alert":this.hasValid?"status":void 0},this.hintContent)}}}}const se={color:String,width:{type:[String,Number]},height:{type:[String,Number]},name:{type:String,required:!0},provider:{type:String},prefix:{type:String,default:"normal"},src:String,horizontalFlip:Boolean,verticalFlip:Boolean,flip:String,mode:String,inline:Boolean,rotate:[Number,String],onLoad:Function,svg:String,modifiers:{type:[String,Array]}};var I=(t=>(t.left="left",t.right="right",t.top="top",t.bottom="bottom",t))(I||{}),F=(t=>(t.topStart="top-start",t.topEnd="top-end",t.bottomStart="bottom-start",t.bottomEnd="bottom-end",t.leftStart="left-start",t.leftEnd="left-end",t.rightStart="right-start",t.rightEnd="right-end",t))(F||{}),D=(t=>(t.before="before",t.after="after",t))(D||{}),R=(t=>(t.button="button",t.submit="submit",t.reset="reset",t))(R||{}),q=(t=>(t._blank="_blank",t._self="_self",t._parent="_parent",t._top="_top",t))(q||{});const ie=Symbol.for("volver");function ce(){return e.inject(ie)}function z(t,n,o){return e.computed(()=>{const r={[t]:!0},l=typeof(n==null?void 0:n.value)=="string"?n.value.split(" "):n==null?void 0:n.value;return l&&Array.isArray(l)&&l.forEach(d=>{r[`${t}--${d}`]=!0}),o&&Object.keys(o.value).forEach(d=>{r[`${t}--${d}`]=e.unref(o.value[d])}),r})}const ue={name:"VvIcon"},w=e.defineComponent({...ue,props:se,setup(t){const n=t,o=e.ref(!0),r=ce(),{modifiers:l}=e.toRefs(n),d=z("vv-icon",l),u=e.computed(()=>n.provider||(r==null?void 0:r.provider)),_=e.computed(()=>{const s=n.name??"",i=`@${u.value}:${n.prefix}:${n.name}`;return B.iconExists(s)?s:B.iconExists(i)?i:(r==null?void 0:r.iconsCollections.find(b=>{const p=`@${u.value}:${b.prefix}:${s}`;if(B.iconExists(p))return p}))||s});function g(s){let i=null;if(typeof window>"u"){const{JSDOM:y}=require("jsdom");i=new y().window}return(i?new i.DOMParser:new window.DOMParser).parseFromString(s,"text/html").querySelector("svg")}function m(s){const i=g(s),b=(i==null?void 0:i.innerHTML.trim())||"";i&&b&&B.addIcon(`@${u.value}:${n.prefix}:${n.name}`,{body:b,height:i.viewBox.baseVal.height,width:i.viewBox.baseVal.width})}return r&&(n.src&&!B.iconExists(`@${u.value}:${n.prefix}:${n.name}`)?(o.value=!1,r.fetchIcon(n.src).then(s=>{s&&(m(s),o.value=!0)}).catch(s=>{throw new Error(`During fetch icon: ${s==null?void 0:s.message}`)})):n.svg&&m(n.svg)),(s,i)=>e.unref(o)?(e.openBlock(),e.createBlock(e.unref(B.Icon),e.mergeProps({key:0,class:e.unref(d)},{inline:s.inline,width:s.width,height:s.height,horizontalFlip:s.horizontalFlip,verticalFlip:s.verticalFlip,flip:s.flip,rotate:s.rotate,color:s.color,onLoad:s.onLoad,icon:e.unref(_)}),null,16,["class"])):e.createCommentVNode("",!0)}}),de={to:{type:[String,Object]},href:String,target:{type:String,validator:t=>Object.values(q).includes(t)},rel:{type:String,default:"noopener noreferrer"}},pe={valid:Boolean,validLabel:[String,Array]},fe={invalid:Boolean,invalidLabel:[String,Array]},me={loading:Boolean,loadingLabel:{type:String,default:"Loading..."}},K={disabled:Boolean},he={active:Boolean},be={pressed:Boolean},X={label:[String,Number]},Se={readonly:Boolean},ge={modifiers:[String,Array]},ye={hintLabel:{type:String,default:""}},we={count:{type:[Boolean,String],default:!1,validator:t=>[!0,!1,"limit","countdown"].includes(t)}},Ee={debounce:[Number,String]},ve={icon:{type:[String,Object]},iconPosition:{type:String,default:D.before,validation:t=>Object.values(D).includes(t)}},Ie={tabindex:{type:[String,Number],default:0}},_e={floating:Boolean},Ae={id:[String,Number]};I.bottom;const Be={...{...Ae,name:{type:String,required:!0}},...{autofocus:Boolean},...{autocomplete:{type:String,default:"off"}},...Ie,...K,...Se,...pe,...fe,...ye,...me,...ge,...we,...Ee,...ve,..._e,...X,minlength:Number,maxlength:Number,placeholder:String,required:Boolean};({...K,...X,...be,...he,...de,type:R.button});const a={TEXT:"text",PASSWORD:"password",NUMBER:"number",EMAIL:"email",TEL:"tel",URL:"url",COLOR:"color",SEARCH:"search",DATE:"date",TIME:"time",DATETIME_LOCAL:"datetime-local",MONTH:"month",WEEK:"week"},E={PASSWORD_SHOW:"eye-on",PASSWORD_HIDE:"eye-off",DATE:"calendar",TIME:"time",COLOR:"color",SEARCH:"close"},Ce=["update:modelValue","focus","blur","keyup"],Pe={...Be,modelValue:[String,Number],type:{type:String,default:a.TEXT,validator:t=>Object.values(a).includes(t)},min:[Number,Date,String],max:[Number,Date,String],step:{type:[String,Number],default:1},pattern:String,multiple:Boolean,iconShowPassword:{type:String,default:E.PASSWORD_SHOW},iconHidePassword:{type:String,default:E.PASSWORD_HIDE},iconClear:{type:String,default:E.SEARCH},labelStepUp:{type:String,default:"Increase value"},labelStepDown:{type:String,default:"Decrease value"},labelShowPassword:{type:String,default:"Show password"},labelHidePassword:{type:String,default:"Hide password"},labelClear:{type:String,default:"Clear"}},Y=e.defineComponent({components:{VvIcon:w},props:{disabled:{type:Boolean,default:!1},labelShow:{type:String,default:"Show password"},labelHide:{type:String,default:"Hide password"},iconShow:{type:String,default:E.PASSWORD_SHOW},iconHide:{type:String,default:E.PASSWORD_HIDE}},emits:["toggle-password"],setup(t,{emit:n}){const o=e.ref(!1),r=e.computed(()=>o.value?t.iconHide:t.iconShow);function l(d){d==null||d.stopPropagation(),t.disabled||(o.value=!o.value,n("toggle-password",o.value))}return{active:o,activeIcon:r,onClick:l}},render(){const t=e.h(w,{name:this.activeIcon,class:"vv-input-text__action-icon"});return e.h("button",{disabled:this.disabled,class:"vv-input-text__action",ariaLabel:this.active?this.labelHide:this.labelShow,type:"button",onClick:this.onClick},t)}}),V=e.defineComponent({components:{VvIcon:w},props:{disabled:{type:Boolean,default:!1},label:{type:String},mode:{type:String,validator:t=>["up","down"].includes(t),default:"up"}},emits:["step-up","step-down"],setup(t,{emit:n}){const o=e.computed(()=>t.mode==="up");return{isUp:o,onClick:l=>{l==null||l.stopPropagation(),t.disabled||n(o.value?"step-up":"step-down")}}},render(){return e.h("button",{class:["vv-input-text__action-chevron",this.isUp&&"vv-input-text__action-chevron-up"],disabled:this.disabled,ariaLabel:this.label,onClick:this.onClick})}}),J=e.defineComponent({components:{VvIcon:w},props:{disabled:{type:Boolean,default:!1},label:{type:String,default:"Clear"},icon:{type:String,default:"close"}},emits:["clear"],setup(t,{emit:n}){function o(r){r==null||r.stopPropagation(),t.disabled||n("clear")}return{onClick:o}},render(){const t=e.h(w,{name:this.icon,class:"vv-input-text__action-icon"});return e.h("button",{disabled:this.disabled,class:"vv-input-text__action",ariaLabel:this.label,type:"button",onClick:this.onClick},t)}});function x(t,n){return{name:"VvInputTextActions",components:{VvIcon:w,VvInputPasswordAction:Y,VvInputStepAction:V,VvInputClearAction:J},setup(){return{isDisabled:e.computed(()=>n.disabled||n.readonly),labelStepUp:n.labelStepUp,labelStepDown:n.labelStepDown,labelShowPassword:n.labelShowPassword,labelHidePassword:n.labelHidePassword,labelClear:n.labelClear,iconShowPassword:n.iconShowPassword,iconHidePassword:n.iconHidePassword}},render(){let o=null;switch(t){case a.SEARCH:{const{onClear:r}=this.$attrs;o=[e.h(J,{disabled:this.isDisabled,label:this.labelShowPassword,onClear:r})];break}case a.PASSWORD:{const{onTogglePassword:r}=this.$attrs;o=[e.h(Y,{disabled:this.isDisabled,onTogglePassword:r,labelShow:this.labelShowPassword,labelHide:this.labelHidePassword,iconShow:this.iconShowPassword,iconHide:this.iconHidePassword})];break}case a.NUMBER:{const{onStepUp:r,onStepDown:l}=this.$attrs;o=[e.h(V,{mode:"up",disabled:this.isDisabled||n.max!==void 0&&n.modelValue===n.max,label:this.labelStepUp,onStepUp:r,onStepDown:l}),e.h(V,{mode:"down",disabled:this.isDisabled||n.min!==void 0&&n.modelValue===n.min,label:this.labelStepDown,onStepUp:r,onStepDown:l})];break}}return Array.isArray(o)?e.h("div",{class:"vv-input-text__actions-group"},o):o}}}const De=t=>e.computed(()=>String((t==null?void 0:t.value)||re.nanoid()));function Te(t,n,o=0){let r;return typeof o=="string"&&(o=parseInt(o)),e.computed({get:()=>t==null?void 0:t.value,set:l=>{r&&clearTimeout(r),r=setTimeout(()=>{n("update:modelValue",l)},o)}})}function ke(t,n){const{focused:o}=v.useFocus(t);return e.watch(o,r=>{n(r?"focus":"blur",e.unref(t))}),{focused:o}}function Oe(t,n){const o=e.computed(()=>Boolean((t==null?void 0:t.value)&&n.value===D.before)),r=e.computed(()=>Boolean((t==null?void 0:t.value)&&n.value===D.after)),l=e.computed(()=>Boolean((t==null?void 0:t.value)&&n.value===I.left)),d=e.computed(()=>Boolean((t==null?void 0:t.value)&&n.value===I.right)),u=e.computed(()=>Boolean((t==null?void 0:t.value)&&n.value===I.top)),_=e.computed(()=>Boolean((t==null?void 0:t.value)&&n.value===I.bottom));return{hasIcon:e.computed(()=>typeof(t==null?void 0:t.value)=="string"?{name:t==null?void 0:t.value}:t==null?void 0:t.value),hasIconLeft:l,hasIconRight:d,hasIconTop:u,hasIconBottom:_,hasIconBefore:o,hasIconAfter:r}}function Ne(t,n){const o=e.computed(()=>(e.unref(t)??"").length),r=e.computed(()=>(n==null?void 0:n.lowerLimit)!==void 0&&o.value<(n==null?void 0:n.lowerLimit)?o.value-n.lowerLimit:(n==null?void 0:n.upperLimit)!==void 0&&o.value<(n==null?void 0:n.upperLimit)?n.upperLimit-o.value:0),l=e.computed(()=>(n==null?void 0:n.mode)===!1?"":(n==null?void 0:n.mode)==="limit"&&(n!=null&&n.upperLimit)?`${o.value} / ${n.lowerLimit?`${n.lowerLimit}-`:""}${n.upperLimit}`:(n==null?void 0:n.mode)==="countdown"?r.value===0?void 0:r:o.value);return{length:o,gap:r,formatted:l}}const Re=["for"],Ve={class:"vv-input-text__wrapper"},xe={key:0,class:"vv-input-text__input-before"},He={class:"vv-input-text__inner"},Le=["id"],Me={key:1,class:"vv-input-text__input-after"},$e={key:2,class:"vv-input-text__limit"},je={name:"VvInputText"};return e.defineComponent({...je,props:Pe,emits:Ce,setup(t,{emit:n}){const o=t,r=e.useSlots(),l=e.ref(),{id:d,icon:u,iconPosition:_,label:g,modelValue:m,count:s,valid:i,invalid:b,loading:p}=e.toRefs(o),h=De(d),y=e.computed(()=>`${h.value}-hint`),O=e.computed(()=>o.floating&&P(o.placeholder)?" ":o.placeholder),S=Te(m,n,o.debounce),{focused:C}=ke(l,n),H=v.useElementVisibility(l);e.watch(H,c=>{c&&o.autofocus&&(C.value=!0)});const T=e.ref(!1),N=e.computed(()=>o.type===a.PASSWORD),A=()=>{T.value=!T.value},Ue=e.computed(()=>o.type===a.TIME||o.type===a.DATETIME_LOCAL||o.type===a.DATE||o.type===a.WEEK||o.type===a.MONTH),We=e.computed(()=>o.type===a.NUMBER),G=()=>{$.value&&(l.value.stepUp(),S.value=e.unref(l).value)},Q=()=>{$.value&&(l.value.stepDown(),S.value=e.unref(l).value)},Fe=e.computed(()=>o.type===a.SEARCH),Z=()=>{S.value=void 0},{hasIcon:ee,hasIconBefore:te,hasIconAfter:L}=Oe(u,_),M=e.computed(()=>{switch(o.type){case a.COLOR:return{name:E.COLOR};case a.DATE:case a.DATETIME_LOCAL:case a.WEEK:case a.MONTH:return{name:E.DATE};case a.TIME:return{name:E.TIME};default:return""}}),{formatted:qe}=Ne(S,{mode:o.count,upperLimit:o.maxlength,lowerLimit:o.minlength}),$=e.computed(()=>!o.disabled&&!o.readonly),ze=e.computed(()=>$.value?o.tabindex:-1),ne=e.computed(()=>!P(m)),Ke=e.computed(()=>{if(b.value===!0)return!0;if(i.value===!0)return!1}),{modifiers:Xe}=e.toRefs(o),Ye=z("vv-input-text",Xe,e.computed(()=>({valid:i.value,invalid:b.value,loading:p.value,disabled:o.disabled,readonly:o.readonly,"icon-before":te.value,"icon-after":L.value||!P(M),floating:o.floating&&!P(o.label),dirty:ne.value,focus:C.value}))),Je=e.computed(()=>{const c=(()=>N.value&&T.value||Ue.value&&!ne.value&&!C.value?a.TEXT:o.type)(),f={type:c,name:o.name,tabindex:ze.value,disabled:o.disabled,readonly:o.readonly,required:o.required,autocomplete:o.autocomplete,"aria-invalid":Ke.value,"aria-describedby":!oe.value&&Qe.value?y.value:void 0,"aria-errormessage":oe.value?y.value:void 0};return(c===a.DATE||c===a.MONTH||c===a.WEEK||c===a.TIME||c===a.DATETIME_LOCAL||c===a.NUMBER)&&(f.step=o.step,f.max=String(o.max),f.min=String(o.min)),(c===a.TEXT||c===a.SEARCH||c===a.URL||c===a.TEL||c===a.EMAIL||c===a.PASSWORD||c===a.NUMBER)&&(f.placeholder=O.value),(c===a.TEXT||c===a.SEARCH||c===a.URL||c===a.TEL||c===a.EMAIL||c===a.PASSWORD)&&(f.minlength=o.minlength,f.maxlength=o.maxlength,f.pattern=o.pattern),c===a.EMAIL&&(f.multiple=o.multiple),f}),j=e.computed(()=>({valid:o.valid,invalid:o.invalid,modelValue:o.modelValue,togglePassword:A,stepUp:G,stepDown:Q,clear:Z})),{HintSlot:Ge,hasHint:Qe,hasInvalid:oe}=le(o,r),Ze=x(a.PASSWORD,o),et=x(a.NUMBER,o),tt=x(a.SEARCH,o);return(c,f)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(e.unref(Ye))},[e.unref(g)?(e.openBlock(),e.createElementBlock("label",{key:0,for:e.unref(h),class:"vv-input-text__label"},e.toDisplayString(e.unref(g)),9,Re)):e.createCommentVNode("",!0),e.createElementVNode("div",Ve,[c.$slots.before?(e.openBlock(),e.createElementBlock("div",xe,[e.renderSlot(c.$slots,"before",e.normalizeProps(e.guardReactiveProps(e.unref(j))))])):e.createCommentVNode("",!0),e.createElementVNode("div",He,[e.unref(te)?(e.openBlock(),e.createBlock(w,e.mergeProps({key:0,class:"vv-input-text__icon"},e.unref(ee)),null,16)):e.createCommentVNode("",!0),e.withDirectives(e.createElementVNode("input",e.mergeProps({id:e.unref(h),ref_key:"input",ref:l,"onUpdate:modelValue":f[0]||(f[0]=U=>e.isRef(S)?S.value=U:null)},e.unref(Je),{onKeyup:f[1]||(f[1]=U=>n("keyup",U))}),null,16,Le),[[e.vModelDynamic,e.unref(S)]]),e.unref(L)||e.unref(M)?(e.openBlock(),e.createBlock(w,e.mergeProps({key:1,class:"vv-input-text__icon vv-input-text__icon-after"},e.unref(L)?e.unref(ee):e.unref(M)),null,16)):e.unref(N)?(e.openBlock(),e.createBlock(e.unref(Ze),{key:2,onTogglePassword:A})):e.unref(We)?(e.openBlock(),e.createBlock(e.unref(et),{key:3,onStepUp:G,onStepDown:Q})):e.unref(Fe)?(e.openBlock(),e.createBlock(e.unref(tt),{key:4,onClear:Z})):e.createCommentVNode("",!0)]),c.$slots.after?(e.openBlock(),e.createElementBlock("div",Me,[e.renderSlot(c.$slots,"after",e.normalizeProps(e.guardReactiveProps(e.unref(j))))])):e.createCommentVNode("",!0),e.unref(s)?(e.openBlock(),e.createElementBlock("span",$e,[e.renderSlot(c.$slots,"count",e.normalizeProps(e.guardReactiveProps(e.unref(j))),()=>[e.createTextVNode(e.toDisplayString(e.unref(qe)),1)])])):e.createCommentVNode("",!0)]),e.createVNode(e.unref(Ge),{id:e.unref(y),class:"vv-input-text__hint"},null,8,["id"])],2))}})});
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("vue"),require("maska"),require("@vueuse/core"),require("@iconify/vue"),require("nanoid")):"function"==typeof define&&define.amd?define(["vue","maska","@vueuse/core","@iconify/vue","nanoid"],t):(e="undefined"!=typeof globalThis?globalThis:e||self).VvInputText=t(e.vue,e.maska,e.core,e.vue$1,e.nanoid)}(this,(function(e,t,o,n,l){"use strict";function a(e,t){if(e&&Object.keys(e).length&&t){if(-1===t.indexOf("."))return e[t];{const o=t.split(".");let n=e;for(let t=0,l=o.length;t<l;++t){if(null==e)return null;n=n[o[t]]}return n}}return null}function i(t){return null==(o=e.unref(t))||""===o||Array.isArray(o)&&0===o.length||!(o instanceof Date)&&"object"==typeof o&&0===Object.keys(o).length;var o}function r(e){return Array.isArray(e)?e.filter((e=>{return"string"==typeof(t=e)||t instanceof String;var t})).join(" "):e}const u={color:String,width:{type:[String,Number]},height:{type:[String,Number]},name:{type:String,required:!0},provider:{type:String},prefix:{type:String,default:"normal"},src:String,horizontalFlip:Boolean,verticalFlip:Boolean,flip:String,mode:String,inline:Boolean,rotate:[Number,String],onLoad:Function,svg:String,modifiers:{type:[String,Array]}};var d=(e=>(e.left="left",e.right="right",e.top="top",e.bottom="bottom",e))(d||{}),s=(e=>(e.before="before",e.after="after",e))(s||{}),c=(e=>(e.button="button",e.submit="submit",e.reset="reset",e))(c||{});const p=Symbol.for("volver");function v(t,o,n){return e.computed((()=>{const l={[t]:!0},a="string"==typeof(null==o?void 0:o.value)?o.value.split(" "):null==o?void 0:o.value;return a&&Array.isArray(a)&&a.forEach((e=>{e&&(l[`${t}--${e}`]=!0)})),n&&Object.keys(n.value).forEach((o=>{l[`${t}--${o}`]=e.unref(n.value[o])})),l}))}const m=e.defineComponent({name:"VvIcon",props:u,setup(t){const o=t,l=e.ref(!0),a=e.inject(p),{modifiers:i}=e.toRefs(o),r=v("vv-icon",i),u=e.computed((()=>o.provider||(null==a?void 0:a.iconsProvider))),d=e.computed((()=>{const e=o.name??"",t=`@${u.value}:${o.prefix}:${o.name}`;return n.iconExists(e)?e:n.iconExists(t)?t:(null==a?void 0:a.iconsCollections.find((t=>{const o=`@${u.value}:${t.prefix}:${e}`;if(n.iconExists(o))return o})))||e}));function s(e){const t=function(e){let t=null;if("undefined"==typeof window){const{JSDOM:e}=require("jsdom");t=(new e).window}return(t?new t.DOMParser:new window.DOMParser).parseFromString(e,"text/html").querySelector("svg")}(e),l=(null==t?void 0:t.innerHTML.trim())||"";t&&l&&n.addIcon(`@${u.value}:${o.prefix}:${o.name}`,{body:l,height:t.viewBox.baseVal.height,width:t.viewBox.baseVal.width})}return a&&(o.src&&!n.iconExists(`@${u.value}:${o.prefix}:${o.name}`)?(l.value=!1,a.fetchIcon(o.src).then((e=>{e&&(s(e),l.value=!0)})).catch((e=>{throw new Error(`During fetch icon: ${null==e?void 0:e.message}`)}))):o.svg&&s(o.svg)),(t,o)=>e.unref(l)?(e.openBlock(),e.createBlock(e.unref(n.Icon),e.mergeProps({key:0,class:e.unref(r)},{inline:t.inline,width:t.width,height:t.height,horizontalFlip:t.horizontalFlip,verticalFlip:t.verticalFlip,flip:t.flip,rotate:t.rotate,color:t.color,onLoad:t.onLoad,icon:e.unref(d)}),null,16,["class"])):e.createCommentVNode("",!0)}}),f={valid:Boolean,validLabel:[String,Array]},h={invalid:Boolean,invalidLabel:[String,Array]},b={loading:Boolean,loadingLabel:{type:String,default:"Loading..."}},g={disabled:Boolean},y=(Boolean,Boolean,{label:[String,Number]}),S={readonly:Boolean},w={modifiers:[String,Array]},k={hintLabel:{type:String,default:""}},B={count:{type:[Boolean,String],default:!1,validator:e=>[!0,!1,"limit","countdown"].includes(e)}},E={debounce:[Number,String]},x={icon:{type:[String,Object]},iconPosition:{type:String,default:s.before,validation:e=>Object.values(s).includes(e)}},T={tabindex:{type:[String,Number],default:0}},L={floating:Boolean},A={id:[String,Number]};d.bottom,Boolean,Boolean,Boolean,Boolean,Boolean,Boolean,Boolean,Boolean;const C={...{...A,name:{type:String,required:!0}},...{autofocus:Boolean},...{autocomplete:{type:String,default:"off"}},...T,...g,...S,...f,...h,...k,...b,...w,...B,...E,...x,...L,...y,minlength:[String,Number],maxlength:[String,Number],placeholder:String,required:Boolean};c.button;const P={TEXT:"text",PASSWORD:"password",NUMBER:"number",EMAIL:"email",TEL:"tel",URL:"url",COLOR:"color",SEARCH:"search",DATE:"date",TIME:"time",DATETIME_LOCAL:"datetime-local",MONTH:"month",WEEK:"week"},I="eye-on",V="eye-off",_="calendar",D="time",N="color",R="close",$={...C,modelValue:[String,Number],type:{type:String,default:P.TEXT,validator:e=>Object.values(P).includes(e)},min:[Number,Date,String],max:[Number,Date,String],step:{type:[String,Number],default:1},pattern:String,multiple:Boolean,iconShowPassword:{type:String,default:I},iconHidePassword:{type:String,default:V},iconClear:{type:String,default:R},labelStepUp:{type:String,default:"Increase value"},labelStepDown:{type:String,default:"Decrease value"},labelShowPassword:{type:String,default:"Show password"},labelHidePassword:{type:String,default:"Hide password"},labelClear:{type:String,default:"Clear"},mask:{type:String,default:void 0},maskEager:{type:Boolean,default:!1},maskReversed:{type:Boolean,default:!1},maskTokens:{type:Object,default:void 0},maskTokensReplace:{type:Boolean,default:!1},autoWidth:{type:Boolean,default:!1},hideActions:{type:Boolean,default:!1},unit:{type:String}},H=e.defineComponent({components:{VvIcon:m},props:{disabled:{type:Boolean,default:!1},labelShow:{type:String,default:"Show password"},labelHide:{type:String,default:"Hide password"},iconShow:{type:String,default:I},iconHide:{type:String,default:V}},emits:["toggle-password"],setup(t,{emit:o}){const n=e.ref(!1),l=e.computed((()=>n.value?t.iconHide:t.iconShow));return{active:n,activeIcon:l,onClick:function(e){null==e||e.stopPropagation(),t.disabled||(n.value=!n.value,o("toggle-password",n.value))}}},render(){const t=e.h(m,{name:this.activeIcon,class:"vv-input-text__icon"});return e.h("button",{disabled:this.disabled,class:"vv-input-text__action",ariaLabel:this.active?this.labelHide:this.labelShow,type:"button",onClick:this.onClick},t)}}),M=e.defineComponent({components:{VvIcon:m},props:{disabled:{type:Boolean,default:!1},label:{type:String},mode:{type:String,validator:e=>["up","down"].includes(e),default:"up"}},emits:["step-up","step-down"],setup(t,{emit:o}){const n=e.computed((()=>"up"===t.mode));return{isUp:n,onClick:e=>{null==e||e.stopPropagation(),t.disabled||o(n.value?"step-up":"step-down")}}},render(){return e.h("button",{class:["vv-input-text__action vv-input-text__action-chevron",this.isUp&&"vv-input-text__action-chevron-up"],disabled:this.disabled,ariaLabel:this.label,type:"button",onClick:this.onClick})}}),O=e.defineComponent({components:{VvIcon:m},props:{disabled:{type:Boolean,default:!1},label:{type:String,default:"Clear"},icon:{type:String,default:"close"}},emits:["clear"],setup:(e,{emit:t})=>({onClick:function(o){null==o||o.stopPropagation(),e.disabled||t("clear")}}),render(){const t=e.h(m,{name:this.icon,class:"vv-input-text__icon"});return e.h("button",{disabled:this.disabled,class:"vv-input-text__action",ariaLabel:this.label,type:"button",onClick:this.onClick},t)}});function U(t,o){return{name:"VvInputTextActions",components:{VvIcon:m,VvInputPasswordAction:H,VvInputStepAction:M,VvInputClearAction:O},setup:()=>({isDisabled:e.computed((()=>o.disabled||o.readonly)),labelStepUp:o.labelStepUp,labelStepDown:o.labelStepDown,labelShowPassword:o.labelShowPassword,labelHidePassword:o.labelHidePassword,labelClear:o.labelClear,iconShowPassword:o.iconShowPassword,iconHidePassword:o.iconHidePassword}),render(){let n=null;switch(t){case P.SEARCH:{const{onClear:t}=this.$attrs;n=[e.h(O,{disabled:this.isDisabled,label:this.labelShowPassword,onClear:t})];break}case P.PASSWORD:{const{onTogglePassword:t}=this.$attrs;n=[e.h(H,{disabled:this.isDisabled,onTogglePassword:t,labelShow:this.labelShowPassword,labelHide:this.labelHidePassword,iconShow:this.iconShowPassword,iconHide:this.iconHidePassword})];break}case P.NUMBER:{const{onStepUp:t,onStepDown:l}=this.$attrs;n=[e.h(M,{mode:"up",disabled:this.isDisabled||void 0!==o.max&&o.modelValue===o.max,label:this.labelStepUp,onStepUp:t,onStepDown:l}),e.h(M,{mode:"down",disabled:this.isDisabled||void 0!==o.min&&o.modelValue===o.min,label:this.labelStepDown,onStepUp:t,onStepDown:l})];break}}return Array.isArray(n)?e.h("div",{class:"vv-input-text__actions-group"},n):n}}}const j=["for"],W={class:"vv-input-text__wrapper"},q={key:0,class:"vv-input-text__input-before"},F=["onClick"],z=["id"],X={key:1,class:"vv-input-text__unit"},K={key:5,class:"vv-input-text__input-after"},J={key:6,class:"vv-input-text__limit"};return e.defineComponent({name:"VvInputText",props:$,emits:["update:modelValue","focus","blur","keyup"],setup(n,{expose:u,emit:c}){const p=n,f=e.useSlots(),h=e.ref(),b=e.ref();u({$inner:b});const{id:g,icon:y,iconPosition:S,label:w,modelValue:k,count:B,valid:E,invalid:x,loading:T}=e.toRefs(p),L=(t=>e.computed((()=>String((null==t?void 0:t.value)||l.nanoid()))))(g),A=e.computed((()=>`${L.value}-hint`)),C=e.computed((()=>p.floating&&i(p.placeholder)?" ":p.placeholder)),I=function(t,o,n=0,{getter:l=(e=>e),setter:a=(e=>e)}={}){let i;return"string"==typeof n&&(n=parseInt(n)),e.computed({get:()=>l(null==t?void 0:t.value),set:e=>{i&&clearTimeout(i),i=setTimeout((()=>{o("update:modelValue",a(e))}),n)}})}(k,c,p.debounce,{getter:e=>we.value?we.value.masked(e??""):e,setter:e=>(we.value&&(e=we.value.unmasked(e)),p.type===P.NUMBER?Number(e):e)}),{focused:V}=function(t,n){const{focused:l}=o.useFocus(t);return e.watch(l,(o=>{n(o?"focus":"blur",e.unref(t))})),{focused:l}}(h,c),R=e.computed((()=>V.value&&!p.disabled&&!p.readonly)),$=o.useElementVisibility(h);e.watch($,(e=>{e&&p.autofocus&&!p.disabled&&!p.readonly&&(V.value=!0)}));const H=e.ref(!1),M=e.computed((()=>p.type===P.PASSWORD)),O=()=>{H.value=!H.value},G=e.computed((()=>p.type===P.TIME||p.type===P.DATETIME_LOCAL||p.type===P.DATE||p.type===P.WEEK||p.type===P.MONTH)),Q=e.computed((()=>p.type===P.NUMBER)),Y=()=>{re.value&&(h.value.stepUp(),I.value=e.unref(h).value)},Z=()=>{re.value&&(h.value.stepDown(),I.value=e.unref(h).value)},ee=e.computed((()=>p.type===P.SEARCH)),te=()=>{I.value=void 0},{hasIcon:oe,hasIconBefore:ne,hasIconAfter:le}=function(t,o){const n=e.computed((()=>Boolean((null==t?void 0:t.value)&&o.value===s.before))),l=e.computed((()=>Boolean((null==t?void 0:t.value)&&o.value===s.after))),a=e.computed((()=>Boolean((null==t?void 0:t.value)&&o.value===d.left))),i=e.computed((()=>Boolean((null==t?void 0:t.value)&&o.value===d.right))),r=e.computed((()=>Boolean((null==t?void 0:t.value)&&o.value===d.top))),u=e.computed((()=>Boolean((null==t?void 0:t.value)&&o.value===d.bottom)));return{hasIcon:e.computed((()=>"string"==typeof(null==t?void 0:t.value)?{name:null==t?void 0:t.value}:null==t?void 0:t.value)),hasIconLeft:a,hasIconRight:i,hasIconTop:r,hasIconBottom:u,hasIconBefore:n,hasIconAfter:l}}(y,S),ae=e.computed((()=>{switch(p.type){case P.COLOR:return{name:N};case P.DATE:case P.DATETIME_LOCAL:case P.WEEK:case P.MONTH:return{name:_};case P.TIME:return{name:D};default:return""}})),{formatted:ie}=function(t,o){const n=e.computed((()=>(e.unref(t)??"").length)),l=e.computed((()=>void 0!==(null==o?void 0:o.lowerLimit)&&n.value<(null==o?void 0:o.lowerLimit)?n.value-o.lowerLimit:void 0!==(null==o?void 0:o.upperLimit)&&n.value<(null==o?void 0:o.upperLimit)?o.upperLimit-n.value:0)),a=e.computed((()=>{if(!1===(null==o?void 0:o.mode))return"";if("limit"===(null==o?void 0:o.mode)&&(null==o?void 0:o.upperLimit))return`${n.value} / ${o.lowerLimit?`${o.lowerLimit}-`:""}${o.upperLimit}`;if("countdown"===(null==o?void 0:o.mode)){if(0===l.value)return;return l}return n.value}));return{length:n,gap:l,formatted:a}}(I,{mode:p.count,upperLimit:Number(p.maxlength),lowerLimit:Number(p.minlength)}),re=e.computed((()=>!p.disabled&&!p.readonly)),ue=e.computed((()=>re.value?p.tabindex:-1)),de=e.computed((()=>!i(k))),se=e.computed((()=>!0===x.value||!0!==E.value&&void 0)),{modifiers:ce}=e.toRefs(p),pe=v("vv-input-text",ce,e.computed((()=>({valid:E.value,invalid:x.value,loading:T.value,disabled:p.disabled,readonly:p.readonly,"icon-before":ne.value,"icon-after":le.value||!i(ae),floating:p.floating&&!i(p.label),dirty:de.value,focus:R.value,"auto-width":p.autoWidth})))),ve=e.computed((()=>{const e=M.value&&H.value?P.TEXT:!G.value||de.value||V.value?p.type:P.TEXT,t={type:e,name:p.name,tabindex:ue.value,disabled:p.disabled,readonly:p.readonly,required:p.required,autocomplete:p.autocomplete,"aria-invalid":se.value,"aria-describedby":!be.value&&he.value?A.value:void 0,"aria-errormessage":be.value?A.value:void 0};return e!==P.DATE&&e!==P.MONTH&&e!==P.WEEK&&e!==P.TIME&&e!==P.DATETIME_LOCAL&&e!==P.NUMBER||(t.step=p.step,t.max=void 0!==p.max?String(p.max):void 0,t.min=void 0!==p.min?String(p.min):void 0),e!==P.TEXT&&e!==P.SEARCH&&e!==P.URL&&e!==P.TEL&&e!==P.EMAIL&&e!==P.PASSWORD&&e!==P.NUMBER||(t.placeholder=C.value),e!==P.TEXT&&e!==P.SEARCH&&e!==P.URL&&e!==P.TEL&&e!==P.EMAIL&&e!==P.PASSWORD||(t.minlength=p.minlength,t.maxlength=p.maxlength,t.pattern=p.pattern),e===P.EMAIL&&(t.multiple=p.multiple),t})),me=e.computed((()=>({valid:p.valid,invalid:p.invalid,modelValue:p.modelValue,togglePassword:O,stepUp:Y,stepDown:Z,clear:te}))),{HintSlot:fe,hasHint:he,hasInvalid:be}=function(t,n){const{invalid:l,valid:u,hint:d,loading:s}=n,{hintLabel:c,modelValue:p,valid:v,validLabel:m,invalid:f,invalidLabel:h,...b}=e.toRefs(t),g=a(b,"loading"),y=a(b,"loadingLabel"),S=e.computed((()=>!(!f.value||(!f.value||!l)&&!((null==h?void 0:h.value)&&Array.isArray(h.value)&&h.value.length>0)&&(!(null==h?void 0:h.value)||i(h))))),w=e.computed((()=>!!(c&&c.value||d))),k=e.computed((()=>!!(m&&m.value||u))),B=e.computed((()=>!!((null==g?void 0:g.value)&&s||(null==g?void 0:g.value)&&(null==y?void 0:y.value)))),E=e.computed((()=>w.value||k.value||S.value||B.value));return{hasInvalid:S,hasHint:w,hasValid:k,hasLoading:B,HintSlot:{name:"HintSlot",props:{params:{type:Object,default:()=>({})}},setup(t){const n=e.computed((()=>{const e=o.toReactive({hintLabel:c,modelValue:p,valid:v,validLabel:m,invalid:f,invalidLabel:h,loading:g,loadingLabel:y,...t.params});return(null==f?void 0:f.value)?(null==l?void 0:l(e))||r(null==h?void 0:h.value)||(null==c?void 0:c.value):(null==v?void 0:v.value)?(null==u?void 0:u(e))||r(null==m?void 0:m.value)||(null==c?void 0:c.value):(null==g?void 0:g.value)?(null==s?void 0:s(e))||r(null==y?void 0:y.value)||(null==c?void 0:c.value):(null==d?void 0:d(e))||r(null==c?void 0:c.value)||(null==c?void 0:c.value)}));return{isVisible:E,hasInvalid:S,hasValid:k,hintContent:n}},render(){if(this.isVisible)return e.h("small",{role:this.hasInvalid?"alert":this.hasValid?"status":void 0},this.hintContent)}}}}(p,f),ge=U(P.PASSWORD,p),ye=U(P.NUMBER,p),Se=U(P.SEARCH,p),we=e.ref();e.watch([()=>p.mask,()=>p.type,()=>p.maskEager,()=>p.maskReversed,()=>p.maskTokens,()=>p.maskTokensReplace],(([e,o,n,l,a,i])=>{e&&o===P.TEXT?we.value=new t.Mask({mask:e,eager:n,reversed:l,tokens:a,tokensReplace:i}):we.value=void 0}),{immediate:!0});const ke=()=>{re.value&&(V.value=!0)},Be=e.computed((()=>{if(p.autoWidth)return{width:void 0!==I.value?`${String(I.value).length+1}ch`:void 0}}));return(t,o)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(e.unref(pe))},[e.unref(w)?(e.openBlock(),e.createElementBlock("label",{key:0,for:e.unref(L),class:"vv-input-text__label"},e.toDisplayString(e.unref(w)),9,j)):e.createCommentVNode("",!0),e.createElementVNode("div",W,[t.$slots.before?(e.openBlock(),e.createElementBlock("div",q,[e.renderSlot(t.$slots,"before",e.normalizeProps(e.guardReactiveProps(e.unref(me))))])):e.createCommentVNode("",!0),e.createElementVNode("div",{ref_key:"innerEl",ref:b,class:"vv-input-text__inner",onClick:e.withModifiers(ke,["stop"])},[e.unref(ne)?(e.openBlock(),e.createBlock(m,e.mergeProps({key:0,class:"vv-input-text__icon"},e.unref(oe)),null,16)):e.createCommentVNode("",!0),e.withDirectives(e.createElementVNode("input",e.mergeProps({id:e.unref(L),ref_key:"inputEl",ref:h,"onUpdate:modelValue":o[0]||(o[0]=t=>e.isRef(I)?I.value=t:null)},e.unref(ve),{style:e.unref(Be),onKeyup:o[1]||(o[1]=e=>c("keyup",e))}),null,16,z),[[e.vModelDynamic,e.unref(I)]]),(t.unit||t.$slots.unit)&&e.unref(de)?(e.openBlock(),e.createElementBlock("div",X,[e.renderSlot(t.$slots,"default",e.normalizeProps(e.guardReactiveProps(e.unref(me))),(()=>[e.createTextVNode(e.toDisplayString(t.unit),1)]))])):e.createCommentVNode("",!0)],8,F),e.unref(le)||e.unref(ae)?(e.openBlock(),e.createBlock(m,e.mergeProps({key:1,class:"vv-input-text__icon vv-input-text__icon-after"},e.unref(le)?e.unref(oe):e.unref(ae)),null,16)):e.unref(M)&&!t.hideActions&&e.unref(re)?(e.openBlock(),e.createBlock(e.unref(ge),{key:2,onTogglePassword:O})):e.unref(Q)&&!t.hideActions&&e.unref(re)?(e.openBlock(),e.createBlock(e.unref(ye),{key:3,onStepUp:Y,onStepDown:Z})):e.unref(ee)&&!t.hideActions&&e.unref(re)?(e.openBlock(),e.createBlock(e.unref(Se),{key:4,onClear:te})):e.createCommentVNode("",!0),t.$slots.after?(e.openBlock(),e.createElementBlock("div",K,[e.renderSlot(t.$slots,"after",e.normalizeProps(e.guardReactiveProps(e.unref(me))))])):e.createCommentVNode("",!0),e.unref(B)?(e.openBlock(),e.createElementBlock("span",J,[e.renderSlot(t.$slots,"count",e.normalizeProps(e.guardReactiveProps(e.unref(me))),(()=>[e.createTextVNode(e.toDisplayString(e.unref(ie)),1)]))])):e.createCommentVNode("",!0)]),e.createVNode(e.unref(fe),{id:e.unref(A),class:"vv-input-text__hint"},null,8,["id"])],2))}})}));

package/dist/components/VvInputText/VvInputText.vue.d.ts

@@ -1,9 +1,9 @@
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     modelValue: (StringConstructor | NumberConstructor)[];
     type: {
-        type: import("vue").PropType<import("@/components/VvInputText").InputType>;
+        type: globalThis.PropType<import("../VvInputText").InputType>;
         default: "text";
-        validator: (value: import("@/components/VvInputText").InputType) => boolean;
+        validator: (value: import("../VvInputText").InputType) => boolean;
     };
     min: (StringConstructor | DateConstructor | NumberConstructor)[];
     max: (StringConstructor | DateConstructor | NumberConstructor)[];
@@ -45,8 +45,39 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         type: StringConstructor;
         default: string;
     };
-    minlength: NumberConstructor;
-    maxlength: NumberConstructor;
+    mask: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    maskEager: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    maskReversed: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    maskTokens: {
+        type: globalThis.PropType<import("maska").MaskTokens>;
+        default: undefined;
+    };
+    maskTokensReplace: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    autoWidth: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    hideActions: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    unit: {
+        type: StringConstructor;
+    };
+    minlength: (StringConstructor | NumberConstructor)[];
+    maxlength: (StringConstructor | NumberConstructor)[];
     placeholder: StringConstructor;
     required: BooleanConstructor;
     label: (StringConstructor | NumberConstructor)[];
@@ -55,9 +86,9 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         type: (StringConstructor | ObjectConstructor)[];
     };
     iconPosition: {
-        type: import("vue").PropType<import("../../constants.js").Position>;
-        default: import("../../constants.js").Position;
-        validation: (value: import("../../constants.js").Position) => boolean;
+        type: globalThis.PropType<"before" | "after">;
+        default: import("../../constants").Position;
+        validation: (value: import("../../constants").Position) => boolean;
     };
     debounce: (StringConstructor | NumberConstructor)[];
     count: {
@@ -65,7 +96,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         default: boolean;
         validator: (value: string) => boolean;
     };
-    modifiers: import("vue").PropType<string | string[]>;
+    modifiers: globalThis.PropType<string | string[]>;
     loading: BooleanConstructor;
     loadingLabel: {
         type: StringConstructor;
@@ -95,12 +126,14 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         required: boolean;
     };
     id: (StringConstructor | NumberConstructor)[];
-}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, string[], string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+}, {
+    $inner: globalThis.Ref<any>;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, string[], string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     modelValue: (StringConstructor | NumberConstructor)[];
     type: {
-        type: import("vue").PropType<import("@/components/VvInputText").InputType>;
+        type: globalThis.PropType<import("../VvInputText").InputType>;
         default: "text";
-        validator: (value: import("@/components/VvInputText").InputType) => boolean;
+        validator: (value: import("../VvInputText").InputType) => boolean;
     };
     min: (StringConstructor | DateConstructor | NumberConstructor)[];
     max: (StringConstructor | DateConstructor | NumberConstructor)[];
@@ -142,8 +175,39 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         type: StringConstructor;
         default: string;
     };
-    minlength: NumberConstructor;
-    maxlength: NumberConstructor;
+    mask: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    maskEager: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    maskReversed: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    maskTokens: {
+        type: globalThis.PropType<import("maska").MaskTokens>;
+        default: undefined;
+    };
+    maskTokensReplace: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    autoWidth: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    hideActions: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    unit: {
+        type: StringConstructor;
+    };
+    minlength: (StringConstructor | NumberConstructor)[];
+    maxlength: (StringConstructor | NumberConstructor)[];
     placeholder: StringConstructor;
     required: BooleanConstructor;
     label: (StringConstructor | NumberConstructor)[];
@@ -152,9 +216,9 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         type: (StringConstructor | ObjectConstructor)[];
     };
     iconPosition: {
-        type: import("vue").PropType<import("../../constants.js").Position>;
-        default: import("../../constants.js").Position;
-        validation: (value: import("../../constants.js").Position) => boolean;
+        type: globalThis.PropType<"before" | "after">;
+        default: import("../../constants").Position;
+        validation: (value: import("../../constants").Position) => boolean;
     };
     debounce: (StringConstructor | NumberConstructor)[];
     count: {
@@ -162,7 +226,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         default: boolean;
         validator: (value: string) => boolean;
     };
-    modifiers: import("vue").PropType<string | string[]>;
+    modifiers: globalThis.PropType<string | string[]>;
     loading: BooleanConstructor;
     loadingLabel: {
         type: StringConstructor;
@@ -196,9 +260,11 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
 }, {
     disabled: boolean;
-    type: import("@/components/VvInputText").InputType;
+    type: import("../VvInputText").InputType;
+    mask: string;
+    floating: boolean;
     required: boolean;
-    iconPosition: import("../../constants.js").Position;
+    iconPosition: "before" | "after";
     loading: boolean;
     loadingLabel: string;
     multiple: boolean;
@@ -207,7 +273,6 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     invalid: boolean;
     valid: boolean;
     tabindex: string | number;
-    floating: boolean;
     autocomplete: string;
     autofocus: boolean;
     step: string | number;
@@ -219,6 +284,12 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     labelShowPassword: string;
     labelHidePassword: string;
     labelClear: string;
+    maskEager: boolean;
+    maskReversed: boolean;
+    maskTokens: import("maska").MaskTokens;
+    maskTokensReplace: boolean;
+    autoWidth: boolean;
+    hideActions: boolean;
     count: string | boolean;
 }>, {
     before: (_: {
@@ -230,6 +301,15 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         stepDown: () => void;
         clear: () => void;
     }) => any;
+    default: (_: {
+        valid: boolean;
+        invalid: boolean;
+        modelValue: string | number | undefined;
+        togglePassword: () => void;
+        stepUp: () => void;
+        stepDown: () => void;
+        clear: () => void;
+    }) => any;
     after: (_: {
         valid: boolean;
         invalid: boolean;

package/dist/components/VvInputText/VvInputTextActions.d.ts

@@ -1,3 +1,3 @@
 import type { Component } from 'vue';
-import { type VvInputTextPropsTypes } from '@/components/VvInputText';
+import { type VvInputTextPropsTypes } from '.';
 export default function VvInputTextActionsFactory(type: string, parentProps: VvInputTextPropsTypes): Component;

package/dist/components/VvInputText/index.d.ts

@@ -1,4 +1,5 @@
 import type { ExtractPropTypes, PropType } from 'vue';
+import type { MaskTokens } from 'maska';
 export declare const INPUT_TYPES: {
     readonly TEXT: "text";
     readonly PASSWORD: "password";
@@ -131,21 +132,77 @@ export declare const VvInputTextProps: {
         type: StringConstructor;
         default: string;
     };
-    minlength: NumberConstructor;
-    maxlength: NumberConstructor;
+    /**
+     * Input mask, only for text type
+     * @see https://beholdr.github.io/maska/
+     */
+    mask: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    /**
+     * Show mask before typing
+     * @see https://beholdr.github.io/maska/#/?id=maskinput-options
+     */
+    maskEager: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Write values reverse (ex. for numbers)
+     * @see https://beholdr.github.io/maska/#/?id=maskinput-options
+     */
+    maskReversed: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Add mask custom tokens
+     * @see https://beholdr.github.io/maska/#/?id=custom-tokens
+     */
+    maskTokens: {
+        type: PropType<MaskTokens>;
+        default: undefined;
+    };
+    /**
+     * Replace default tokens
+     * @see https://beholdr.github.io/maska/#/?id=custom-tokens
+     */
+    maskTokensReplace: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Adjust input width to content
+     */
+    autoWidth: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Hide type number, password and search actions
+     */
+    hideActions: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Add unit label to input
+     */
+    unit: {
+        type: StringConstructor;
+    };
+    minlength: (StringConstructor | NumberConstructor)[];
+    maxlength: (StringConstructor | NumberConstructor)[];
     placeholder: StringConstructor;
     required: BooleanConstructor;
-    label: (StringConstructor | NumberConstructor)[]; /**
-     * Pattern the value must match to be valid
-     * Available for input types: text, search, url, tel, email and password
-     * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#pattern
-     */
+    label: (StringConstructor | NumberConstructor)[];
     floating: BooleanConstructor;
     icon: {
         type: (StringConstructor | ObjectConstructor)[];
     };
     iconPosition: {
-        type: PropType<import("../../constants").Position>;
+        type: PropType<"before" | "after">;
         default: import("../../constants").Position;
         validation: (value: import("../../constants").Position) => boolean;
     };
@@ -159,11 +216,7 @@ export declare const VvInputTextProps: {
     loading: BooleanConstructor;
     loadingLabel: {
         type: StringConstructor;
-        default: string; /**
-         * Maximum value
-         * Available for input types: date, month, week, time, datetime-local, number, range.
-         * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#max
-         */
+        default: string;
     };
     hintLabel: {
         type: StringConstructor;