@volverjs/ui-vue 0.0.3 → 0.0.5-beta.1

package/dist/components/VvTextarea/VvTextarea.umd.js

@@ -1 +1 @@
-(function(e,d){typeof exports=="object"&&typeof module<"u"?module.exports=d(require("vue"),require("@iconify/vue")):typeof define=="function"&&define.amd?define(["vue","@iconify/vue"],d):(e=typeof globalThis<"u"?globalThis:e||self,e.VvTextarea=d(e.vue,e.vue$1))})(this,function(e,d){"use strict";function _(o){return Array.isArray(o)?o.filter(s=>isString(s)).join(" "):o}function j(o,s){const{invalid:t,valid:l,hint:u,loading:y}=s,{hintLabel:a,modelValue:P,valid:m,validLabel:c,invalid:r,invalidLabel:n,...p}=toRefs(o),i=resolveFieldData(p,"loading"),f=resolveFieldData(p,"loadingLabel"),g=computed(()=>r.value?!!(r.value&&t||n!=null&&n.value&&Array.isArray(n.value)&&n.value.length>0||n!=null&&n.value&&!isEmpty(n)):!1),B=computed(()=>!!(a&&a.value||u)),V=computed(()=>!!(c&&c.value||l)),v=computed(()=>!!(i!=null&&i.value&&y||i!=null&&i.value&&(f!=null&&f.value))),x=computed(()=>B.value||V.value||g.value||v.value);return{hasInvalid:g,hasHint:B,hasValid:V,hasLoading:v,HintSlot:{name:"HintSlot",props:{params:{type:Object,default:()=>({})}},setup(w){const k=computed(()=>{const b=toReactive({hintLabel:a,modelValue:P,valid:m,validLabel:c,invalid:r,invalidLabel:n,loading:i,loadingLabel:f,...w.params});return r!=null&&r.value?(t==null?void 0:t(b))||_(n==null?void 0:n.value)||(a==null?void 0:a.value):m!=null&&m.value?(l==null?void 0:l(b))||_(c==null?void 0:c.value)||(a==null?void 0:a.value):i!=null&&i.value?(y==null?void 0:y(b))||_(f==null?void 0:f.value)||(a==null?void 0:a.value):(u==null?void 0:u(b))||_(a==null?void 0:a.value)||(a==null?void 0:a.value)});return{isVisible:x,hasInvalid:g,hasValid:V,hintContent:k}},render(){if(this.isVisible)return h("small",{role:this.hasInvalid?"alert":this.hasValid?"status":void 0},this.hintContent)}}}}const O={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]}},T={name:"VvIcon"},D=e.defineComponent({...T,props:O,setup(o){const s=o,t=ref(!0),l=useVolver(),{modifiers:u}=toRefs(s),y=useBemModifiers("vv-icon",u),a=computed(()=>s.provider||(l==null?void 0:l.provider)),P=computed(()=>{const r=s.name??"",n=`@${a.value}:${s.prefix}:${s.name}`;return d.iconExists(r)?r:d.iconExists(n)?n:(l==null?void 0:l.iconsCollections.find(p=>{const i=`@${a.value}:${p.prefix}:${r}`;if(d.iconExists(i))return i}))||r});function m(r){let n=null;if(typeof window>"u"){const{JSDOM:g}=require("jsdom");n=new g().window}return(n?new n.DOMParser:new window.DOMParser).parseFromString(r,"text/html").querySelector("svg")}function c(r){const n=m(r),p=(n==null?void 0:n.innerHTML.trim())||"";n&&p&&d.addIcon(`@${a.value}:${s.prefix}:${s.name}`,{body:p,height:n.viewBox.baseVal.height,width:n.viewBox.baseVal.width})}return l&&(s.src&&!d.iconExists(`@${a.value}:${s.prefix}:${s.name}`)?(t.value=!1,l.fetchIcon(s.src).then(r=>{r&&(c(r),t.value=!0)}).catch(r=>{throw new Error(`During fetch icon: ${r==null?void 0:r.message}`)})):s.svg&&c(s.svg)),(r,n)=>e.unref(t)?(e.openBlock(),e.createBlock(e.unref(d.Icon),e.mergeProps({key:0,class:e.unref(y)},{inline:r.inline,width:r.width,height:r.height,horizontalFlip:r.horizontalFlip,verticalFlip:r.verticalFlip,flip:r.flip,rotate:r.rotate,color:r.color,onLoad:r.onLoad,icon:e.unref(P)}),null,16,["class"])):e.createCommentVNode("",!0)}});var N=(o=>(o.left="left",o.right="right",o.top="top",o.bottom="bottom",o))(N||{}),F=(o=>(o.topStart="top-start",o.topEnd="top-end",o.bottomStart="bottom-start",o.bottomEnd="bottom-end",o.leftStart="left-start",o.leftEnd="left-end",o.rightStart="right-start",o.rightEnd="right-end",o))(F||{}),E=(o=>(o.before="before",o.after="after",o))(E||{});const z={valid:Boolean,validLabel:[String,Array]},q={invalid:Boolean,invalidLabel:[String,Array]},R={loading:Boolean,loadingLabel:String},H={disabled:Boolean},M={readonly:Boolean},K={modifiers:[String,Array]},U={hintLabel:{type:String,default:""}},W={count:{type:[Boolean,String],default:!1,validator:o=>[!0,!1,"limit","countdown"].includes(o)}},J={debounce:[Number,String]},L={icon:{type:[String,Object]},iconPosition:{type:String,default:E.before,validation:o=>Object.values(E).includes(o)}},G={tabindex:{type:[String,Number],default:0}},Q={floating:Boolean},X={id:[String,Number]};N.bottom;const Y={...{...X,name:{type:String,required:!0}},...{autofocus:Boolean},...{autocomplete:{type:String,default:"off"}},...G,...H,...M,...z,...q,...U,...R,...K,...W,...J,...L,...Q,minlength:Number,maxlength:Number,placeholder:String,required:Boolean,label:String},Z={hard:"hard",soft:"soft"},ee={true:!0,false:!1,default:"default"},te=["update:modelValue","focus","blur","keyup"],oe={...Y,modelValue:String,cols:{type:[String,Number],default:20},rows:{type:[String,Number],default:2},wrap:{type:String,default:Z.soft},spellcheck:{type:[Boolean,String],default:ee.default},resizable:Boolean},re=["for"],ne={class:"vv-textarea__wrapper"},ae={key:0,class:"vv-textarea__input-before"},se={class:"vv-textarea__inner"},ie=["id"],le={key:1,class:"vv-textarea__input-after"},ce={key:2,class:"vv-textarea__limit"},de={name:"VvTextarea"};return e.defineComponent({...de,props:oe,emits:te,setup(o,{emit:s}){const t=o,l=useSlots(),u=ref(),{id:y,icon:a,iconPosition:P,label:m,modelValue:c,count:r,valid:n,invalid:p,loading:i,modifiers:f}=toRefs(t),g=useUniqueId(y),B=computed(()=>`${g.value}-hint`),V=computed(()=>t.floating&&isEmpty(t.placeholder)?" ":t.placeholder),v=useDebouncedInput(c,s,t.debounce),{hasIcon:x,hasIconBefore:w,hasIconAfter:k}=useComponentIcon(a,P),{focused:b}=useComponentFocus(u,s),ue=useElementVisibility(u);watch(ue,S=>{S&&t.autofocus&&(b.value=!0)});const{formatted:pe}=useTextCount(v,{mode:t.count,upperLimit:t.maxlength,lowerLimit:t.minlength}),fe=computed(()=>!t.disabled&&!t.readonly),me=computed(()=>fe.value?t.tabindex:-1),ge=computed(()=>!isEmpty(c)),he=computed(()=>{if(t.invalid===!0)return!0;if(t.valid===!0)return!1}),{HintSlot:ye,hasHint:ve,hasInvalid:A}=j(t,l),be=useBemModifiers("vv-textarea",f,computed(()=>({valid:n.value,invalid:p.value,loading:i.value,disabled:t.disabled,readonly:t.readonly,"icon-before":w.value,"icon-after":k.value,floating:t.floating&&!isEmpty(t.label),dirty:ge.value,focused:b.value,resizable:t.resizable}))),Se=computed(()=>({name:t.name,placeholder:V.value,tabindex:me.value,disabled:t.disabled,readonly:t.readonly,required:t.required,autocomplete:t.autocomplete,minlength:t.minlength,maxlength:t.maxlength,cols:t.cols,rows:t.rows,wrap:t.wrap,spellcheck:t.spellcheck,"aria-invalid":he.value,"aria-describedby":!A.value&&ve.value?B.value:void 0,"aria-errormessage":A.value?B.value:void 0})),I=computed(()=>({valid:t.valid,invalid:t.invalid,modelValue:t.modelValue,hintLabel:t.hintLabel,maxlength:t.maxlength,minlength:t.minlength,clear:Be})),Be=()=>{v.value=void 0};return(S,C)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(e.unref(be))},[e.unref(m)?(e.openBlock(),e.createElementBlock("label",{key:0,for:e.unref(g),class:"vv-textarea__label"},e.toDisplayString(e.unref(m)),9,re)):e.createCommentVNode("",!0),e.createElementVNode("div",ne,[S.$slots.before?(e.openBlock(),e.createElementBlock("div",ae,[e.renderSlot(S.$slots,"before",e.normalizeProps(e.guardReactiveProps(e.unref(I))))])):e.createCommentVNode("",!0),e.createElementVNode("div",se,[e.unref(w)?(e.openBlock(),e.createBlock(D,e.mergeProps({key:0,class:"vv-textarea__icon"},e.unref(x)),null,16)):e.createCommentVNode("",!0),e.withDirectives(e.createElementVNode("textarea",e.mergeProps({id:e.unref(g),ref_key:"textarea",ref:u,"onUpdate:modelValue":C[0]||(C[0]=$=>e.isRef(v)?v.value=$:null)},e.unref(Se),{onKeyup:C[1]||(C[1]=$=>s("keyup",$))}),null,16,ie),[[e.vModelText,e.unref(v)]]),e.unref(k)?(e.openBlock(),e.createBlock(D,e.mergeProps({key:1,class:"vv-textarea__icon vv-textarea__icon-after"},e.unref(x)),null,16)):e.createCommentVNode("",!0)]),S.$slots.after?(e.openBlock(),e.createElementBlock("div",le,[e.renderSlot(S.$slots,"after",e.normalizeProps(e.guardReactiveProps(e.unref(I))))])):e.createCommentVNode("",!0),e.unref(r)?(e.openBlock(),e.createElementBlock("span",ce,[e.renderSlot(S.$slots,"count",e.normalizeProps(e.guardReactiveProps(e.unref(I))),()=>[e.createTextVNode(e.toDisplayString(e.unref(pe)),1)])])):e.createCommentVNode("",!0)]),e.createVNode(e.unref(ye),{id:e.unref(B),class:"vv-textarea__hint"},null,8,["id"])],2))}})});
+!function(e,l){"object"==typeof exports&&"undefined"!=typeof module?module.exports=l(require("vue"),require("@vueuse/core"),require("@iconify/vue"),require("nanoid")):"function"==typeof define&&define.amd?define(["vue","@vueuse/core","@iconify/vue","nanoid"],l):(e="undefined"!=typeof globalThis?globalThis:e||self).VvTextarea=l(e.vue,e.core,e.vue$1,e.nanoid)}(this,(function(e,l,o,t){"use strict";function n(e,l){if(e&&Object.keys(e).length&&l){if(-1===l.indexOf("."))return e[l];{const o=l.split(".");let t=e;for(let l=0,n=o.length;l<n;++l){if(null==e)return null;t=t[o[l]]}return t}}return null}function a(l){return null==(o=e.unref(l))||""===o||Array.isArray(o)&&0===o.length||!(o instanceof Date)&&"object"==typeof o&&0===Object.keys(o).length;var o}function i(e){return Array.isArray(e)?e.filter((e=>{return"string"==typeof(l=e)||l instanceof String;var l})).join(" "):e}const r={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 u=(e=>(e.left="left",e.right="right",e.top="top",e.bottom="bottom",e))(u||{}),d=(e=>(e.before="before",e.after="after",e))(d||{}),v=(e=>(e.button="button",e.submit="submit",e.reset="reset",e))(v||{});const c=Symbol.for("volver");function s(l,o,t){return e.computed((()=>{const n={[l]:!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&&(n[`${l}--${e}`]=!0)})),t&&Object.keys(t.value).forEach((o=>{n[`${l}--${o}`]=e.unref(t.value[o])})),n}))}const m=e.defineComponent({name:"VvIcon",props:r,setup(l){const t=l,n=e.ref(!0),a=e.inject(c),{modifiers:i}=e.toRefs(t),r=s("vv-icon",i),u=e.computed((()=>t.provider||(null==a?void 0:a.iconsProvider))),d=e.computed((()=>{const e=t.name??"",l=`@${u.value}:${t.prefix}:${t.name}`;return o.iconExists(e)?e:o.iconExists(l)?l:(null==a?void 0:a.iconsCollections.find((l=>{const t=`@${u.value}:${l.prefix}:${e}`;if(o.iconExists(t))return t})))||e}));function v(e){const l=function(e){let l=null;if("undefined"==typeof window){const{JSDOM:e}=require("jsdom");l=(new e).window}return(l?new l.DOMParser:new window.DOMParser).parseFromString(e,"text/html").querySelector("svg")}(e),n=(null==l?void 0:l.innerHTML.trim())||"";l&&n&&o.addIcon(`@${u.value}:${t.prefix}:${t.name}`,{body:n,height:l.viewBox.baseVal.height,width:l.viewBox.baseVal.width})}return a&&(t.src&&!o.iconExists(`@${u.value}:${t.prefix}:${t.name}`)?(n.value=!1,a.fetchIcon(t.src).then((e=>{e&&(v(e),n.value=!0)})).catch((e=>{throw new Error(`During fetch icon: ${null==e?void 0:e.message}`)}))):t.svg&&v(t.svg)),(l,t)=>e.unref(n)?(e.openBlock(),e.createBlock(e.unref(o.Icon),e.mergeProps({key:0,class:e.unref(r)},{inline:l.inline,width:l.width,height:l.height,horizontalFlip:l.horizontalFlip,verticalFlip:l.verticalFlip,flip:l.flip,rotate:l.rotate,color:l.color,onLoad:l.onLoad,icon:e.unref(d)}),null,16,["class"])):e.createCommentVNode("",!0)}}),f={valid:Boolean,validLabel:[String,Array]},p={invalid:Boolean,invalidLabel:[String,Array]},g={loading:Boolean,loadingLabel:{type:String,default:"Loading..."}},h={disabled:Boolean},b=(Boolean,Boolean,{label:[String,Number]}),y={readonly:Boolean},B={modifiers:[String,Array]},S={hintLabel:{type:String,default:""}},x={count:{type:[Boolean,String],default:!1,validator:e=>[!0,!1,"limit","countdown"].includes(e)}},w={debounce:[Number,String]},L={icon:{type:[String,Object]},iconPosition:{type:String,default:d.before,validation:e=>Object.values(d).includes(e)}},k={tabindex:{type:[String,Number],default:0}},V={floating:Boolean},$={id:[String,Number]};u.bottom,Boolean,Boolean,Boolean,Boolean,Boolean,Boolean,Boolean,Boolean;const N={...{...$,name:{type:String,required:!0}},...{autofocus:Boolean},...{autocomplete:{type:String,default:"off"}},...k,...h,...y,...f,...p,...S,...g,...B,...x,...w,...L,...V,...b,minlength:Number,maxlength:Number,placeholder:String,required:Boolean};v.button;const _={...N,modelValue:String,cols:{type:[String,Number],default:20},rows:{type:[String,Number],default:2},wrap:{type:String,default:"soft"},spellcheck:{type:[Boolean,String],default:"default"},resizable:Boolean};const I=["for"],E={class:"vv-textarea__wrapper"},P={key:0,class:"vv-textarea__input-before"},A={class:"vv-textarea__inner"},C=["id"],j={key:1,class:"vv-textarea__input-after"},q={key:2,class:"vv-textarea__limit"};return e.defineComponent({name:"VvTextarea",props:_,emits:["update:modelValue","focus","blur","keyup"],setup(o,{emit:r}){const v=o,c=e.useSlots(),f=e.ref(),{id:p,icon:g,iconPosition:h,label:b,modelValue:y,count:B,valid:S,invalid:x,loading:w,modifiers:L}=e.toRefs(v),k=(l=>e.computed((()=>String((null==l?void 0:l.value)||t.nanoid()))))(p),V=e.computed((()=>`${k.value}-hint`)),$=e.computed((()=>v.floating&&a(v.placeholder)?" ":v.placeholder)),N=function(l,o,t=0,{getter:n=(e=>e),setter:a=(e=>e)}={}){let i;return"string"==typeof t&&(t=parseInt(t)),e.computed({get:()=>n(null==l?void 0:l.value),set:e=>{i&&clearTimeout(i),i=setTimeout((()=>{o("update:modelValue",a(e))}),t)}})}(y,r,v.debounce),{hasIcon:_,hasIconBefore:z,hasIconAfter:O}=function(l,o){const t=e.computed((()=>Boolean((null==l?void 0:l.value)&&o.value===d.before))),n=e.computed((()=>Boolean((null==l?void 0:l.value)&&o.value===d.after))),a=e.computed((()=>Boolean((null==l?void 0:l.value)&&o.value===u.left))),i=e.computed((()=>Boolean((null==l?void 0:l.value)&&o.value===u.right))),r=e.computed((()=>Boolean((null==l?void 0:l.value)&&o.value===u.top))),v=e.computed((()=>Boolean((null==l?void 0:l.value)&&o.value===u.bottom)));return{hasIcon:e.computed((()=>"string"==typeof(null==l?void 0:l.value)?{name:null==l?void 0:l.value}:null==l?void 0:l.value)),hasIconLeft:a,hasIconRight:i,hasIconTop:r,hasIconBottom:v,hasIconBefore:t,hasIconAfter:n}}(g,h),{focused:T}=function(o,t){const{focused:n}=l.useFocus(o);return e.watch(n,(l=>{t(l?"focus":"blur",e.unref(o))})),{focused:n}}(f,r),F=l.useElementVisibility(f);e.watch(F,(e=>{e&&v.autofocus&&(T.value=!0)}));const{formatted:R}=function(l,o){const t=e.computed((()=>(e.unref(l)??"").length)),n=e.computed((()=>void 0!==(null==o?void 0:o.lowerLimit)&&t.value<(null==o?void 0:o.lowerLimit)?t.value-o.lowerLimit:void 0!==(null==o?void 0:o.upperLimit)&&t.value<(null==o?void 0:o.upperLimit)?o.upperLimit-t.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`${t.value} / ${o.lowerLimit?`${o.lowerLimit}-`:""}${o.upperLimit}`;if("countdown"===(null==o?void 0:o.mode)){if(0===n.value)return;return n}return t.value}));return{length:t,gap:n,formatted:a}}(N,{mode:v.count,upperLimit:v.maxlength,lowerLimit:v.minlength}),D=e.computed((()=>!v.disabled&&!v.readonly)),H=e.computed((()=>D.value?v.tabindex:-1)),M=e.computed((()=>!a(y))),J=e.computed((()=>!0===v.invalid||!0!==v.valid&&void 0)),{HintSlot:K,hasHint:U,hasInvalid:G}=function(o,t){const{invalid:r,valid:u,hint:d,loading:v}=t,{hintLabel:c,modelValue:s,valid:m,validLabel:f,invalid:p,invalidLabel:g,...h}=e.toRefs(o),b=n(h,"loading"),y=n(h,"loadingLabel"),B=e.computed((()=>!(!p.value||(!p.value||!r)&&!((null==g?void 0:g.value)&&Array.isArray(g.value)&&g.value.length>0)&&(!(null==g?void 0:g.value)||a(g))))),S=e.computed((()=>!!(c&&c.value||d))),x=e.computed((()=>!!(f&&f.value||u))),w=e.computed((()=>!!((null==b?void 0:b.value)&&v||(null==b?void 0:b.value)&&(null==y?void 0:y.value)))),L=e.computed((()=>S.value||x.value||B.value||w.value));return{hasInvalid:B,hasHint:S,hasValid:x,hasLoading:w,HintSlot:{name:"HintSlot",props:{params:{type:Object,default:()=>({})}},setup(o){const t=e.computed((()=>{const e=l.toReactive({hintLabel:c,modelValue:s,valid:m,validLabel:f,invalid:p,invalidLabel:g,loading:b,loadingLabel:y,...o.params});return(null==p?void 0:p.value)?(null==r?void 0:r(e))||i(null==g?void 0:g.value)||(null==c?void 0:c.value):(null==m?void 0:m.value)?(null==u?void 0:u(e))||i(null==f?void 0:f.value)||(null==c?void 0:c.value):(null==b?void 0:b.value)?(null==v?void 0:v(e))||i(null==y?void 0:y.value)||(null==c?void 0:c.value):(null==d?void 0:d(e))||i(null==c?void 0:c.value)||(null==c?void 0:c.value)}));return{isVisible:L,hasInvalid:B,hasValid:x,hintContent:t}},render(){if(this.isVisible)return e.h("small",{role:this.hasInvalid?"alert":this.hasValid?"status":void 0},this.hintContent)}}}}(v,c),Q=s("vv-textarea",L,e.computed((()=>({valid:S.value,invalid:x.value,loading:w.value,disabled:v.disabled,readonly:v.readonly,"icon-before":z.value,"icon-after":O.value,floating:v.floating&&!a(v.label),dirty:M.value,focused:T.value,resizable:v.resizable})))),W=e.computed((()=>({name:v.name,placeholder:$.value,tabindex:H.value,disabled:v.disabled,readonly:v.readonly,required:v.required,autocomplete:v.autocomplete,minlength:v.minlength,maxlength:v.maxlength,cols:v.cols,rows:v.rows,wrap:v.wrap,spellcheck:v.spellcheck,"aria-invalid":J.value,"aria-describedby":!G.value&&U.value?V.value:void 0,"aria-errormessage":G.value?V.value:void 0}))),X=e.computed((()=>({valid:v.valid,invalid:v.invalid,modelValue:v.modelValue,hintLabel:v.hintLabel,maxlength:v.maxlength,minlength:v.minlength,clear:Y}))),Y=()=>{N.value=void 0};return(l,o)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(e.unref(Q))},[e.unref(b)?(e.openBlock(),e.createElementBlock("label",{key:0,for:e.unref(k),class:"vv-textarea__label"},e.toDisplayString(e.unref(b)),9,I)):e.createCommentVNode("",!0),e.createElementVNode("div",E,[l.$slots.before?(e.openBlock(),e.createElementBlock("div",P,[e.renderSlot(l.$slots,"before",e.normalizeProps(e.guardReactiveProps(e.unref(X))))])):e.createCommentVNode("",!0),e.createElementVNode("div",A,[e.unref(z)?(e.openBlock(),e.createBlock(m,e.mergeProps({key:0,class:"vv-textarea__icon"},e.unref(_)),null,16)):e.createCommentVNode("",!0),e.withDirectives(e.createElementVNode("textarea",e.mergeProps({id:e.unref(k),ref_key:"textarea",ref:f,"onUpdate:modelValue":o[0]||(o[0]=l=>e.isRef(N)?N.value=l:null)},e.unref(W),{onKeyup:o[1]||(o[1]=e=>r("keyup",e))}),null,16,C),[[e.vModelText,e.unref(N)]]),e.unref(O)?(e.openBlock(),e.createBlock(m,e.mergeProps({key:1,class:"vv-textarea__icon vv-textarea__icon-after"},e.unref(_)),null,16)):e.createCommentVNode("",!0)]),l.$slots.after?(e.openBlock(),e.createElementBlock("div",j,[e.renderSlot(l.$slots,"after",e.normalizeProps(e.guardReactiveProps(e.unref(X))))])):e.createCommentVNode("",!0),e.unref(B)?(e.openBlock(),e.createElementBlock("span",q,[e.renderSlot(l.$slots,"count",e.normalizeProps(e.guardReactiveProps(e.unref(X))),(()=>[e.createTextVNode(e.toDisplayString(e.unref(R)),1)]))])):e.createCommentVNode("",!0)]),e.createVNode(e.unref(K),{id:e.unref(V),class:"vv-textarea__hint"},null,8,["id"])],2))}})}));

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

@@ -21,15 +21,15 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     maxlength: NumberConstructor;
     placeholder: StringConstructor;
     required: BooleanConstructor;
-    label: StringConstructor;
+    label: (StringConstructor | NumberConstructor)[];
     floating: BooleanConstructor;
     icon: {
         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: {
@@ -37,9 +37,12 @@ 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: StringConstructor;
+    loadingLabel: {
+        type: StringConstructor;
+        default: string;
+    };
     hintLabel: {
         type: StringConstructor;
         default: string;
@@ -87,15 +90,15 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     maxlength: NumberConstructor;
     placeholder: StringConstructor;
     required: BooleanConstructor;
-    label: StringConstructor;
+    label: (StringConstructor | NumberConstructor)[];
     floating: BooleanConstructor;
     icon: {
         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: {
@@ -103,9 +106,12 @@ 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: StringConstructor;
+    loadingLabel: {
+        type: StringConstructor;
+        default: string;
+    };
     hintLabel: {
         type: StringConstructor;
         default: string;
@@ -134,15 +140,16 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
 }, {
     disabled: boolean;
+    floating: boolean;
     required: boolean;
-    iconPosition: import("../../constants.js").Position;
+    iconPosition: "before" | "after";
     loading: boolean;
+    loadingLabel: string;
     readonly: boolean;
     hintLabel: string;
     invalid: boolean;
     valid: boolean;
     tabindex: string | number;
-    floating: boolean;
     autocomplete: string;
     autofocus: boolean;
     count: string | boolean;

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

@@ -55,13 +55,13 @@ export declare const VvTextareaProps: {
     maxlength: NumberConstructor;
     placeholder: StringConstructor;
     required: BooleanConstructor;
-    label: StringConstructor;
+    label: (StringConstructor | NumberConstructor)[];
     floating: BooleanConstructor;
     icon: {
         type: (StringConstructor | ObjectConstructor)[];
     };
     iconPosition: {
-        type: import("vue").PropType<import("../../constants").Position>;
+        type: globalThis.PropType<"before" | "after">;
         default: import("../../constants").Position;
         validation: (value: import("../../constants").Position) => boolean;
     };
@@ -71,12 +71,12 @@ export declare const VvTextareaProps: {
         default: boolean;
         validator: (value: string) => boolean;
     };
-    modifiers: import("vue").PropType<string | string[]>;
+    modifiers: globalThis.PropType<string | string[]>;
     loading: BooleanConstructor;
-    loadingLabel: StringConstructor; /**
-     * The visible width of the text control, in average character widths. If it is specified, it must be a positive integer. If it is not specified, the default value is 20.
-     * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#cols
-     */
+    loadingLabel: {
+        type: StringConstructor;
+        default: string;
+    };
     hintLabel: {
         type: StringConstructor;
         default: string;

package/dist/components/VvTooltip/VvTooltip.es.js

@@ -1,48 +1,276 @@
-import { defineComponent as l, openBlock as p, createElementBlock as f, normalizeClass as u, unref as d, renderSlot as c, createTextVNode as b, toDisplayString as g } from "vue";
-var e = /* @__PURE__ */ ((t) => (t.left = "left", t.right = "right", t.top = "top", t.bottom = "bottom", t))(e || {}), n = /* @__PURE__ */ ((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))(n || {}), o = /* @__PURE__ */ ((t) => (t.before = "before", t.after = "after", t))(o || {});
-const m = {
+import { computed, unref, defineComponent, toRefs, openBlock, createElementBlock, normalizeClass, renderSlot, createTextVNode, toDisplayString } from "vue";
+var Side = /* @__PURE__ */ ((Side2) => {
+  Side2["left"] = "left";
+  Side2["right"] = "right";
+  Side2["top"] = "top";
+  Side2["bottom"] = "bottom";
+  return Side2;
+})(Side || {});
+var Placement = /* @__PURE__ */ ((Placement2) => {
+  Placement2["topStart"] = "top-start";
+  Placement2["topEnd"] = "top-end";
+  Placement2["bottomStart"] = "bottom-start";
+  Placement2["bottomEnd"] = "bottom-end";
+  Placement2["leftStart"] = "left-start";
+  Placement2["leftEnd"] = "left-end";
+  Placement2["rightStart"] = "right-start";
+  Placement2["rightEnd"] = "right-end";
+  return Placement2;
+})(Placement || {});
+var Position = /* @__PURE__ */ ((Position2) => {
+  Position2["before"] = "before";
+  Position2["after"] = "after";
+  return Position2;
+})(Position || {});
+var ButtonType = /* @__PURE__ */ ((ButtonType2) => {
+  ButtonType2["button"] = "button";
+  ButtonType2["submit"] = "submit";
+  ButtonType2["reset"] = "reset";
+  return ButtonType2;
+})(ButtonType || {});
+var AnchorTarget = /* @__PURE__ */ ((AnchorTarget2) => {
+  AnchorTarget2["_blank"] = "_blank";
+  AnchorTarget2["_self"] = "_self";
+  AnchorTarget2["_parent"] = "_parent";
+  AnchorTarget2["_top"] = "_top";
+  return AnchorTarget2;
+})(AnchorTarget || {});
+const LinkProps = {
+  /**
+   * The router-link/nuxt-link property, if it is defined the button is rendered as a ruouter-link or nuxt-link.
+   * @see Documentation of [router-link](https://router.vuejs.org/api/#router-link) and [nuxt-link](https://nuxtjs.org/api/components-nuxt-link/)
+   */
+  to: {
+    type: [String, Object]
+  },
+  /**
+   * Anchor href
+   */
+  href: String,
+  /**
+   * Anchor target
+   */
+  target: {
+    type: String,
+    validator: (value) => Object.values(AnchorTarget).includes(value)
+  },
+  /**
+   * Anchor rel
+   */
+  rel: {
+    type: String,
+    default: "noopener noreferrer"
+  }
+};
+const DisabledProps = {
+  /**
+   * Whether the form control is disabled
+   */
+  disabled: Boolean
+};
+const ActiveProps = {
+  /**
+   * Whether the item is active
+   */
+  active: Boolean
+};
+const PressedProps = {
+  /**
+   * Whether the item is pressed
+   */
+  pressed: Boolean
+};
+const LabelProps = {
+  /**
+   * The item label
+   */
+  label: [String, Number]
+};
+const ModifiersProps = {
   /**
    * Component BEM modifiers
    */
   modifiers: [String, Array]
 };
-o.before;
-e.bottom;
-const y = {
-  ...m,
+({
+  /**
+   * VvIcon name or props
+   * @see VVIcon
+   */
+  icon: { type: [String, Object] },
+  /**
+   * VvIcon position
+   */
+  iconPosition: {
+    type: String,
+    default: Position.before,
+    validation: (value) => Object.values(Position).includes(value)
+  }
+});
+({
+  /**
+   * Dropdown placement
+   */
+  placement: {
+    type: String,
+    default: Side.bottom,
+    validator: (value) => {
+      return Object.values(Side).includes(value) || Object.values(Placement).includes(value);
+    }
+  },
+  /**
+   * Dropdown show / hide transition name
+   */
+  transitionName: {
+    type: String
+  },
+  /**
+   * Offset of the dropdown from the trigger
+   * @see https://floating-ui.com/docs/offset
+   */
+  offset: {
+    type: [Number, String, Object],
+    default: 0
+  },
+  /**
+   * Move dropdown to the side if there is no space in the default position
+   * @see https://floating-ui.com/docs/shift
+   */
+  shift: {
+    type: [Boolean, Object],
+    default: false
+  },
+  /**
+   * Flip dropdown position if there is no space in the default position
+   * @see https://floating-ui.com/docs/flip
+   */
+  flip: {
+    type: [Boolean, Object],
+    default: true
+  },
+  /**
+   * Size of the dropdown
+   * @see https://floating-ui.com/docs/size
+   */
+  size: {
+    type: [Boolean, Object],
+    default: () => ({ padding: 10 })
+  },
+  /**
+   * Automatically change the position of the dropdown
+   * @see https://floating-ui.com/docs/autoPlacement
+   */
+  autoPlacement: {
+    type: [Boolean, Object],
+    default: false
+  },
+  /**
+   * Add arrow to the dropdown
+   * @see https://floating-ui.com/docs/arrow
+   */
+  arrow: {
+    type: Boolean,
+    default: false
+  },
+  /**
+   * Close dropdown on click outside
+   */
+  autoClose: {
+    type: Boolean,
+    default: true
+  },
+  /**
+   * Autofocus first item on dropdown open
+   */
+  autofocusFirst: {
+    type: Boolean,
+    default: true
+  },
+  /**
+   * Set dropdown width to the same as the trigger
+   */
+  triggerWidth: {
+    type: Boolean
+  }
+});
+({
+  ...DisabledProps,
+  ...LabelProps,
+  ...PressedProps,
+  ...ActiveProps,
+  ...LinkProps,
+  /**
+   * Button type
+   */
+  type: {
+    type: String,
+    default: ButtonType.button,
+    validator: (value) => Object.values(ButtonType).includes(value)
+  }
+});
+const VvTooltipProps = {
+  ...ModifiersProps,
   /**
    * Define the tooltip position
    * @default Side.bottom
    */
   position: {
     type: String,
-    default: e.bottom
+    default: Side.bottom
   },
   value: {
     type: String
   }
-}, S = /* @__PURE__ */ l({
+};
+function useModifiers(prefix, modifiers, others) {
+  return computed(() => {
+    const toReturn = {
+      [prefix]: true
+    };
+    const modifiersArray = typeof (modifiers == null ? void 0 : modifiers.value) === "string" ? modifiers.value.split(" ") : modifiers == null ? void 0 : modifiers.value;
+    if (modifiersArray) {
+      if (Array.isArray(modifiersArray)) {
+        modifiersArray.forEach((modifier) => {
+          if (modifier) {
+            toReturn[`${prefix}--${modifier}`] = true;
+          }
+        });
+      }
+    }
+    if (others) {
+      Object.keys(others.value).forEach((key) => {
+        toReturn[`${prefix}--${key}`] = unref(others.value[key]);
+      });
+    }
+    return toReturn;
+  });
+}
+const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "VvTooltip",
-  props: y,
-  setup(t) {
-    const r = t, { modifiers: s } = toRefs(r), i = useBemModifiers(
+  props: VvTooltipProps,
+  setup(__props) {
+    const props = __props;
+    const { modifiers } = toRefs(props);
+    const bemCssClasses = useModifiers(
       "vv-tooltip",
-      s,
+      modifiers,
       computed(() => ({
-        [r.position]: !0
+        [props.position]: true
       }))
     );
-    return (a, v) => (p(), f("span", {
-      class: u(d(i)),
-      role: "tooltip",
-      inert: ""
-    }, [
-      c(a.$slots, "default", {}, () => [
-        b(g(a.value), 1)
-      ])
-    ], 2));
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("span", {
+        class: normalizeClass(unref(bemCssClasses)),
+        role: "tooltip",
+        inert: ""
+      }, [
+        renderSlot(_ctx.$slots, "default", {}, () => [
+          createTextVNode(toDisplayString(_ctx.value), 1)
+        ])
+      ], 2);
+    };
   }
 });
 export {
-  S as default
+  _sfc_main as default
 };

package/dist/components/VvTooltip/VvTooltip.umd.js

@@ -1 +1 @@
-(function(e,o){typeof exports=="object"&&typeof module<"u"?module.exports=o(require("vue")):typeof define=="function"&&define.amd?define(["vue"],o):(e=typeof globalThis<"u"?globalThis:e||self,e.VvTooltip=o(e.vue))})(this,function(e){"use strict";var o=(t=>(t.left="left",t.right="right",t.top="top",t.bottom="bottom",t))(o||{}),n=(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))(n||{}),r=(t=>(t.before="before",t.after="after",t))(r||{});const a={modifiers:[String,Array]};r.before,o.bottom;const l={...a,position:{type:String,default:o.bottom},value:{type:String}};return e.defineComponent({__name:"VvTooltip",props:l,setup(t){const i=t,{modifiers:f}=toRefs(i),p=useBemModifiers("vv-tooltip",f,computed(()=>({[i.position]:!0})));return(s,d)=>(e.openBlock(),e.createElementBlock("span",{class:e.normalizeClass(e.unref(p)),role:"tooltip",inert:""},[e.renderSlot(s.$slots,"default",{},()=>[e.createTextVNode(e.toDisplayString(s.value),1)])],2))}})});
+!function(e,o){"object"==typeof exports&&"undefined"!=typeof module?module.exports=o(require("vue")):"function"==typeof define&&define.amd?define(["vue"],o):(e="undefined"!=typeof globalThis?globalThis:e||self).VvTooltip=o(e.vue)}(this,(function(e){"use strict";var o=(e=>(e.left="left",e.right="right",e.top="top",e.bottom="bottom",e))(o||{}),t=(e=>(e.before="before",e.after="after",e))(t||{}),n=(e=>(e.button="button",e.submit="submit",e.reset="reset",e))(n||{});Boolean,Boolean,Boolean;const l={modifiers:[String,Array]};t.before,o.bottom,Boolean,Boolean,Boolean,Boolean,Boolean,Boolean,Boolean,Boolean,n.button;const r={...l,position:{type:String,default:o.bottom},value:{type:String}};return e.defineComponent({__name:"VvTooltip",props:r,setup(o){const t=o,{modifiers:n}=e.toRefs(t),l=function(o,t,n){return e.computed((()=>{const l={[o]:!0},r="string"==typeof(null==t?void 0:t.value)?t.value.split(" "):null==t?void 0:t.value;return r&&Array.isArray(r)&&r.forEach((e=>{e&&(l[`${o}--${e}`]=!0)})),n&&Object.keys(n.value).forEach((t=>{l[`${o}--${t}`]=e.unref(n.value[t])})),l}))}("vv-tooltip",n,e.computed((()=>({[t.position]:!0}))));return(o,t)=>(e.openBlock(),e.createElementBlock("span",{class:e.normalizeClass(e.unref(l)),role:"tooltip",inert:""},[e.renderSlot(o.$slots,"default",{},(()=>[e.createTextVNode(e.toDisplayString(o.value),1)]))],2))}})}));

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

@@ -1,23 +1,23 @@
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     position: {
-        type: import("vue").PropType<import("../../constants.js").Side>;
-        default: import("../../constants.js").Side;
+        type: globalThis.PropType<"left" | "right" | "top" | "bottom">;
+        default: import("../../constants").Side;
     };
     value: {
         type: StringConstructor;
     };
-    modifiers: import("vue").PropType<string | string[]>;
+    modifiers: globalThis.PropType<string | string[]>;
 }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     position: {
-        type: import("vue").PropType<import("../../constants.js").Side>;
-        default: import("../../constants.js").Side;
+        type: globalThis.PropType<"left" | "right" | "top" | "bottom">;
+        default: import("../../constants").Side;
     };
     value: {
         type: StringConstructor;
     };
-    modifiers: import("vue").PropType<string | string[]>;
+    modifiers: globalThis.PropType<string | string[]>;
 }>>, {
-    position: import("../../constants.js").Side;
+    position: "left" | "right" | "top" | "bottom";
 }>, {
     default: (_: {}) => any;
 }>;

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

@@ -1,12 +1,12 @@
-import { Side } from '@/constants';
 import type { PropType } from 'vue';
+import { Side } from '../../constants';
 export declare const VvTooltipProps: {
     /**
      * Define the tooltip position
      * @default Side.bottom
      */
     position: {
-        type: PropType<Side>;
+        type: PropType<"left" | "right" | "top" | "bottom">;
         default: Side;
     };
     value: {