@volverjs/ui-vue 0.0.2 → 0.0.3-beta.3

package/dist/components/VvCombobox/VvCombobox.umd.js

@@ -1 +1 @@
-(function(e,$){typeof exports=="object"&&typeof module<"u"?module.exports=$(require("vue"),require("nanoid"),require("@vueuse/core"),require("@iconify/vue")):typeof define=="function"&&define.amd?define(["vue","nanoid","@vueuse/core","@iconify/vue"],$):(e=typeof globalThis<"u"?globalThis:e||self,e.VvCombobox=$(e.vue,e.nanoid,e.core,e.vue$1))})(this,function(e,$,O,w){"use strict";function R(o,n,t){return t?L(o,t)===L(n,t):U(o,n)}function U(o,n){if(o===n)return!0;if(o&&n&&typeof o=="object"&&typeof n=="object"){const t=Array.isArray(o),i=Array.isArray(n);let l,c,r;if(t&&i){if(c=o.length,c!=n.length)return!1;for(l=c;l--!==0;)if(!U(o[l],n[l]))return!1;return!0}if(t!=i)return!1;const y=o instanceof Date,m=n instanceof Date;if(y!=m)return!1;if(y&&m)return o.getTime()==n.getTime();const f=o instanceof RegExp,a=n instanceof RegExp;if(f!=a)return!1;if(f&&a)return o.toString()==n.toString();const s=Object.keys(o);if(c=s.length,c!==Object.keys(n).length)return!1;for(l=c;l--!==0;)if(!Object.prototype.hasOwnProperty.call(n,s[l]))return!1;for(l=c;l--!==0;)if(r=s[l],!U(o[r],n[r]))return!1;return!0}return o!==o&&n!==n}function L(o,n){if(o&&Object.keys(o).length&&n){if(n.indexOf(".")===-1)return o[n];{const t=n.split(".");let i=o;for(let l=0,c=t.length;l<c;++l){if(o==null)return null;i=i[t[l]]}return i}}else return null}function he(o,n){let t=-1;if(n){for(let i=0;i<n.length;i++)if(R(n[i],o)){t=i;break}}return t}function j(o,n){if(o!=null&&n&&n.length){for(const t of n)if(R(o,t))return!0}return!1}function Z(o){return(n=>n==null||n===""||Array.isArray(n)&&n.length===0||!(n instanceof Date)&&typeof n=="object"&&Object.keys(n).length===0)(e.unref(o))}function be(o,n){const t=he(o,n);return t>-1?n.filter((i,l)=>l!==t):n}function Ve(o){return typeof o=="string"||o instanceof String}function oe(o){var n,t;if(o)return(t=(n=o.match(/[A-Z]{2,}(?=[A-Z][a-z]+[0-9]*|\b)|[A-Z]?[a-z]+[0-9]*|[A-Z]|[0-9]+/g))==null?void 0:n.join("-"))==null?void 0:t.toLowerCase()}function F(o,n){const t={[`${o}`]:!0};return{bemCssClasses:e.computed(()=>Object.keys(n).reduce((l,c)=>{const r=e.unref(n[c])||!1;if(!r)return l;if(c==="modifiers"){const y=Array.isArray(r)?r:r.split(" ");return{...l,...y.reduce((m,f)=>({...m,[`${o}--${oe(f)}`]:!0}),{})}}else return{...l,[`${o}--${oe(c)}`]:r}},t)||{})}}function re(o,n,t){const i=e.computed(()=>!!(o!=null&&o.value&&n.value==="left"||t!=null&&t.iconLeft)),l=e.computed(()=>!!(o!=null&&o.value&&n.value==="right"||t!=null&&t.iconRight)),c=e.computed(()=>!!(o!=null&&o.value&&n.value==="top"||t!=null&&t.iconTop)),r=e.computed(()=>!!(o!=null&&o.value&&n.value==="bottom"||t!=null&&t.iconBottom));return{hasIcon:e.computed(()=>typeof(o==null?void 0:o.value)=="string"?{name:o==null?void 0:o.value}:o==null?void 0:o.value),hasIconLeft:i,hasIconRight:l,hasIconTop:c,hasIconBottom:r}}function G(o){const{options:n,labelKey:t,valueKey:i}=e.toRefs(o);return{options:n,getOptionLabel:r=>typeof r!="object"&&r!==null?r:typeof t.value=="function"?t.value(r):r[t.value],getOptionValue:r=>typeof r!="object"&&r!==null?r:typeof i.value=="function"?i.value(r):r[i.value]}}function le(o,n){const{focused:t}=O.useFocus(o);return e.watch(t,i=>{n(i?"focus":"blur",e.unref(o))}),{focused:t}}const ae={valid:Boolean,validLabel:[String,Array]},se={invalid:Boolean,invalidLabel:[String,Array]},ie={loading:Boolean,loadingLabel:String},J={disabled:Boolean},ce={readonly:Boolean},X={modifiers:[String,Array]},de={hintLabel:{type:String,default:""}},Q={options:{type:Array,default:()=>[]},labelKey:{type:[String,Function],default:"label"},valueKey:{type:[String,Function],default:"value"}},ue={LEFT:"left",RIGHT:"right"},fe={icon:{type:[String,Object]},iconPosition:{type:String,validation:o=>Object.values(ue).includes(o),default:ue.RIGHT}},pe={tabindex:{type:[String,Number],default:0}},me={floating:Boolean},ge={unselectable:{type:Boolean,default:!0}},W={id:[String,Number],name:{type:String,required:!0}},Se={autofocus:Boolean},ke={autocomplete:{type:String,default:"off"}},Be={...W,...Q,...J,...X,modelValue:{type:[String,Number,Boolean,Object,Array]},labelNoResults:{type:String,default:"No results"},multiple:Boolean,maxValues:[Number,String],unselectable:{type:Boolean,default:!0}},Ce=["id"],Ne={key:0,role:"option"},Pe=["aria-selected"],$e=["for","onClick"],we=["id","type","value","checked","disabled","name"],Ie={name:"VvDropdown"},_e=e.defineComponent({...Ie,props:Be,emits:["update:modelValue"],setup(o,{emit:n}){const t=o,i=e.computed(()=>String(t.id||$.nanoid())),{modifiers:l,disabled:c}=e.toRefs(t),{getOptionLabel:r,getOptionValue:y}=G(t),{bemCssClasses:m}=F("vv-dropdown",{modifiers:l,disabled:c});function f(d){return Array.isArray(t.modelValue)?j(d,t.modelValue)||j(y(d),t.modelValue):R(d,t.modelValue)||R(y(d),t.modelValue)}function a(d){return typeof d=="string"||d.disabled===void 0?c.value:d.disabled}function s(d){var b;if(t.disabled)return;let p=d;if(t.multiple)if(Array.isArray(t.modelValue)){if(t.maxValues!==void 0&&t.maxValues>=0&&((b=t.modelValue)==null?void 0:b.length)>=t.maxValues&&!j(d,t.modelValue))return;p=j(d,t.modelValue)?be(d,t.modelValue):[...t.modelValue,d]}else p=[d];else t.unselectable&&d===t.modelValue&&(p=void 0);n("update:modelValue",p)}return(d,p)=>{var b;return e.openBlock(),e.createElementBlock("ul",{id:e.unref(i),class:e.normalizeClass(e.unref(m)),role:"listbox"},[(b=d.options)!=null&&b.length?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("li",Ne,[e.createElementVNode("label",null,e.toDisplayString(d.labelNoResults),1)])),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(d.options,(h,S)=>(e.openBlock(),e.createElementBlock("li",{key:S,role:"option","aria-selected":f(h)},[e.createElementVNode("label",{for:`dropdown-${S}-${e.unref(i)}`,onClick:e.withModifiers(B=>s(e.unref(y)(h)),["prevent"])},[e.createElementVNode("input",{id:`dropdown-${S}-${e.unref(i)}`,type:d.multiple?"checkbox":"radio",value:e.unref(y)(h),checked:f(h),disabled:a(h),name:d.name,tabindex:"-1","aria-hidden":"true"},null,8,we),e.createTextVNode(" "+e.toDisplayString(e.unref(r)(h)),1)],8,$e)],8,Pe))),128))],10,Ce)}}}),Ae="ds",Oe={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]}},Ee={name:"VvIcon"},T=e.defineComponent({...Ee,props:Oe,setup(o){const n=o,t=e.ref(!0),{modifiers:i}=e.toRefs(n),l=e.inject(Ae),{bemCssClasses:c}=F("vv-icon",{modifiers:i}),r=e.computed(()=>n.provider||(l==null?void 0:l.provider)),y=e.computed(()=>{const a=n.name??"",s=`@${r.value}:${n.prefix}:${n.name}`;return w.iconExists(a)?a:w.iconExists(s)?s:(l==null?void 0:l.iconsCollections.find(d=>{const p=`@${r.value}:${d.prefix}:${a}`;if(w.iconExists(p))return p}))||a});function m(a){let s=null;if(typeof window>"u"){const{JSDOM:h}=require("jsdom");s=new h().window}return(s?new s.DOMParser:new window.DOMParser).parseFromString(a,"text/html").querySelector("svg")}function f(a){const s=m(a),d=(s==null?void 0:s.innerHTML.trim())||"";s&&d&&w.addIcon(`@${r.value}:${n.prefix}:${n.name}`,{body:d,height:s.viewBox.baseVal.height,width:s.viewBox.baseVal.width})}return l&&(n.src&&!w.iconExists(`@${r.value}:${n.prefix}:${n.name}`)?(t.value=!1,l.fetchIcon(n.src).then(a=>{a&&(f(a),t.value=!0)}).catch(a=>{throw new Error(`During fetch icon: ${a==null?void 0:a.message}`)})):n.svg&&f(n.svg)),(a,s)=>t.value?(e.openBlock(),e.createBlock(e.unref(w.Icon),e.mergeProps({key:0,class:e.unref(c)},{inline:a.inline,width:a.width,height:a.height,horizontalFlip:a.horizontalFlip,verticalFlip:a.verticalFlip,flip:a.flip,rotate:a.rotate,color:a.color,onLoad:a.onLoad,icon:e.unref(y)}),null,16,["class"])):e.createCommentVNode("",!0)}});function x(o){return Array.isArray(o)?o.filter(n=>Ve(n)).join(" "):o}function ye(o,n){const{invalid:t,valid:i,hint:l,loading:c}=n,{hintLabel:r,modelValue:y,valid:m,validLabel:f,invalid:a,invalidLabel:s,...d}=e.toRefs(o),p=L(d,"loading"),b=L(d,"loadingLabel"),h=e.computed(()=>a.value?!!(a.value&&t||s!=null&&s.value&&Array.isArray(s.value)&&s.value.length>0||s!=null&&s.value&&!Z(s)):!1),S=e.computed(()=>!!(r&&r.value||l)),B=e.computed(()=>!!(f&&f.value||i)),C=e.computed(()=>!!(p!=null&&p.value&&c||p!=null&&p.value&&(b!=null&&b.value))),N=e.computed(()=>S.value||B.value||h.value||C.value);return{hasInvalid:h,hasHint:S,hasValid:B,hasLoading:C,HintSlot:{name:"HintSlot",props:{params:{type:Object,default:()=>({})}},setup(I){const _=e.computed(()=>{const k=O.toReactive({hintLabel:r,modelValue:y,valid:m,validLabel:f,invalid:a,invalidLabel:s,loading:p,loadingLabel:b,...I.params});return a!=null&&a.value?(t==null?void 0:t(k))||x(s==null?void 0:s.value)||(r==null?void 0:r.value):m!=null&&m.value?(i==null?void 0:i(k))||x(f==null?void 0:f.value)||(r==null?void 0:r.value):p!=null&&p.value?(c==null?void 0:c(k))||x(b==null?void 0:b.value)||(r==null?void 0:r.value):(l==null?void 0:l(k))||x(r==null?void 0:r.value)||(r==null?void 0:r.value)});return{isVisible:N,hasInvalid:h,hasValid:B,hintContent:_}},render(){if(this.isVisible)return e.h("small",{role:this.hasInvalid||this.hasValid?"alert":void 0},this.hintContent)}}}}const De={...W,...Se,...ke,...pe,...ae,...se,...de,...ie,...J,...ce,...X,...Q,...fe,...me,...ge,multiple:Boolean,required:Boolean,size:[String,Number],modelValue:{type:[String,Number,Boolean,Object,Array],default:void 0},label:String,placeholder:String},Re=["update:modelValue","focus","blur"],Le=["for"],je={class:"vv-select__wrapper"},Fe=["id"],Te=["disabled","hidden"],xe=["disabled","value"],Ke={name:"VvSelect"},qe=e.defineComponent({...Ke,props:De,emits:Re,setup(o,{emit:n}){const t=o,i=e.useSlots(),l=e.ref(),{HintSlot:c,hasHint:r,hasInvalid:y}=ye(t,i),{modifiers:m,disabled:f,readonly:a,loading:s,icon:d,iconPosition:p,invalid:b,valid:h,floating:S,multiple:B}=e.toRefs(t),C=e.computed(()=>String(t.id||$.nanoid())),N=e.computed(()=>`${C.value}-hint`),{focused:I}=le(l,n),_=O.useElementVisibility(l);e.watch(_,g=>{g&&t.autofocus&&(I.value=!0)});const{hasIcon:k,hasIconLeft:E,hasIconRight:K}=re(d,p),q=e.computed(()=>!Z(t.modelValue)),z=e.computed(()=>t.disabled||t.readonly),H=e.computed(()=>z.value?-1:t.tabindex),M=e.computed(()=>{if(t.invalid===!0)return!0;if(t.valid===!0)return!1}),{bemCssClasses:Y}=F("vv-select",{modifiers:m,valid:h,invalid:b,loading:s,disabled:f,readonly:a,iconLeft:E,iconRight:K,dirty:q,focus:I,floating:S,multiple:B}),v=e.computed(()=>({name:t.name,tabindex:H.value,disabled:z.value,required:t.required,size:t.size,autocomplete:t.autocomplete,multiple:t.multiple,"aria-invalid":M.value,"aria-describedby":!y.value&&r.value?N.value:void 0,"aria-errormessage":y.value?N.value:void 0})),{getOptionLabel:ee,getOptionValue:te}=G(t);function ne(g){return typeof g=="string"||g.disabled===void 0?f.value:g.disabled}const D=e.computed({get:()=>t.modelValue,set:g=>{Array.isArray(g)&&(g=g.filter(A=>A!==void 0)),n("update:modelValue",g)}});return(g,A)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(e.unref(Y))},[g.label?(e.openBlock(),e.createElementBlock("label",{key:0,for:e.unref(C)},e.toDisplayString(g.label),9,Le)):e.createCommentVNode("",!0),e.createElementVNode("div",je,[e.renderSlot(g.$slots,"before",{},()=>[e.unref(E)?(e.openBlock(),e.createBlock(T,e.normalizeProps(e.mergeProps({key:0},e.unref(k))),null,16)):e.createCommentVNode("",!0)]),e.withDirectives(e.createElementVNode("select",e.mergeProps({id:e.unref(C),ref_key:"select",ref:l,"onUpdate:modelValue":A[0]||(A[0]=u=>e.isRef(D)?D.value=u:null)},e.unref(v)),[g.placeholder?(e.openBlock(),e.createElementBlock("option",{key:0,value:void 0,disabled:!g.unselectable,hidden:!g.unselectable},e.toDisplayString(g.placeholder),9,Te)):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(g.options,(u,V)=>(e.openBlock(),e.createElementBlock("option",{key:V,disabled:ne(u),value:e.unref(te)(u)},e.toDisplayString(e.unref(ee)(u)),9,xe))),128))],16,Fe),[[e.vModelSelect,e.unref(D)]]),e.renderSlot(g.$slots,"after",{},()=>[e.unref(K)?(e.openBlock(),e.createBlock(T,e.normalizeProps(e.mergeProps({key:0},e.unref(k))),null,16)):e.createCommentVNode("",!0)])]),e.createVNode(e.unref(c),{id:e.unref(N),class:"vv-select__hint"},null,8,["id"])],2))}}),ze=["update:modelValue","change:search","focus","blur"],He={...W,...pe,...ae,...se,...de,...ie,...J,...ce,...X,...Q,...fe,...me,...ge,modelValue:{type:[String,Number,Boolean,Object,Array],default:void 0},label:String,labelNoResults:{type:String,default:"No results"},placeholder:String,searchable:Boolean,searchPlaceholder:String,debounceSearch:{type:[Number,String],default:0},multiple:Boolean,maxValues:[Number,String],separator:{type:String,default:", "},native:Boolean},Me=["id"],Ue=["id","for"],Ze=["tabindex"],Ge=["id","placeholder"],Je={name:"VvCombobox"};return e.defineComponent({...Je,props:He,emits:ze,setup(o,{emit:n}){const t=o,i=e.useSlots(),{HintSlot:l}=ye(t,i),c=e.ref(),r=e.ref(),{focused:y}=le(c,n),m=e.computed(()=>String(t.id||$.nanoid())),f=e.ref(""),a=O.refDebounced(f,Number(t.debounceSearch)),s=e.ref(!1),{icon:d,iconPosition:p,modifiers:b,disabled:h,readonly:S,loading:B,valid:C,invalid:N,floating:I}=e.toRefs(t);e.watch(a,()=>n("change:search",a.value));const{hasIcon:_,hasIconLeft:k,hasIconRight:E}=re(d,p),K=e.computed(()=>!Z(t.modelValue)),q=e.computed(()=>h.value||S.value?-1:t.tabindex),{bemCssClasses:z}=F("vv-select",{modifiers:b,disabled:h,loading:B,readonly:S,iconLeft:k,iconRight:E,valid:C,invalid:N,dirty:K,focus:y,floating:I}),H=e.computed(()=>t.searchable?v.value:t.options),{getOptionLabel:M,getOptionValue:Y}=G(t),v=e.computed(()=>{var u;return(u=t.options)==null?void 0:u.filter(V=>M(V).toLowerCase().includes(a.value.toLowerCase().trim()))}),ee=e.computed(()=>{let u=[];return Array.isArray(t.modelValue)?u=t.modelValue:t.modelValue&&(u=[t.modelValue]),t.options.filter(V=>u.includes(Y(V)))}),te=e.computed(()=>ee.value.map(u=>M(u)).join(t.separator));O.onClickOutside(c,()=>{c.value.open=!1});function ne(u){const V=u.target;s.value=V.open}function D(u){c.value&&!t.multiple&&(c.value.open=!1),n("update:modelValue",u)}const g=e.computed(()=>({name:t.name,options:H.value,labelKey:t.labelKey,valueKey:t.valueKey,disabled:t.disabled,labelNoResults:t.labelNoResults,multiple:t.multiple,maxValues:t.maxValues,modelValue:t.modelValue,unselectable:t.unselectable})),A=e.computed(()=>({id:m.value,name:t.name,tabindex:q.value,valid:C.value,validLabel:t.validLabel,invalid:N.value,invalidLabel:t.invalidLabel,hintLabel:t.hintLabel,loading:B.value,loadingLabel:t.loadingLabel,disabled:h.value,readonly:S.value,modifiers:t.modifiers,options:H.value,labelKey:t.labelKey,valueKey:t.valueKey,icon:t.icon,iconPosition:t.iconPosition,floating:t.floating,unselectable:t.unselectable,multiple:t.multiple,label:t.label,placeholder:t.placeholder,modelValue:t.modelValue}));return(u,V)=>u.native?(e.openBlock(),e.createBlock(qe,e.mergeProps({key:1},e.unref(A),{"onUpdate:modelValue":V[4]||(V[4]=P=>n("update:modelValue",P))}),null,16)):(e.openBlock(),e.createElementBlock("div",{key:0,id:e.unref(m),class:e.normalizeClass(e.unref(z))},[u.label?(e.openBlock(),e.createElementBlock("label",{key:0,id:`${e.unref(m)}-label`,for:u.searchable&&s.value?`${e.unref(m)}-input`:void 0},e.toDisplayString(u.label),9,Ue)):e.createCommentVNode("",!0),e.createElementVNode("details",{ref_key:"dropdown",ref:c,class:"vv-select__wrapper",onClick:V[2]||(V[2]=P=>e.unref(h)||e.unref(S)?P.preventDefault():null),onKeyup:V[3]||(V[3]=e.withKeys(P=>c.value.open=!1,["esc"])),onToggle:ne},[e.createElementVNode("summary",{class:"vv-select__input",tabindex:e.unref(q),onKeyup:V[1]||(V[1]=e.withKeys(P=>u.searchable?P.preventDefault():null,["space"]))},[e.renderSlot(u.$slots,"before",{},()=>[e.unref(k)?(e.openBlock(),e.createBlock(T,e.mergeProps({key:0,class:"vv-select__icon-left"},e.unref(_)),null,16)):e.createCommentVNode("",!0)]),u.searchable&&s.value?e.withDirectives((e.openBlock(),e.createElementBlock("input",{key:0,id:`${e.unref(m)}-input`,ref_key:"inputSearch",ref:r,"onUpdate:modelValue":V[0]||(V[0]=P=>f.value=P),role:"combobox",type:"search",placeholder:u.searchPlaceholder},null,8,Ge)),[[e.vModelText,f.value]]):(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[e.createTextVNode(e.toDisplayString(e.unref(te)||u.placeholder),1)],64)),e.renderSlot(u.$slots,"after",{},()=>[e.unref(E)?(e.openBlock(),e.createBlock(T,e.mergeProps({key:0,class:"vv-select__icon-right"},e.unref(_)),null,16)):e.createCommentVNode("",!0)])],40,Ze),e.createVNode(_e,e.mergeProps({id:`${e.unref(m)}-dropdown`},e.unref(g),{"onUpdate:modelValue":D}),null,16,["id"])],544),e.createVNode(e.unref(l),{class:"vv-select__hint"})],10,Me))}})});
+(function(e,w){typeof exports=="object"&&typeof module<"u"?module.exports=w(require("vue"),require("nanoid"),require("@iconify/vue")):typeof define=="function"&&define.amd?define(["vue","nanoid","@iconify/vue"],w):(e=typeof globalThis<"u"?globalThis:e||self,e.VvCombobox=w(e.vue,e.nanoid,e.vue$1))})(this,function(e,w,_){"use strict";const Q={valid:Boolean,validLabel:[String,Array]},W={invalid:Boolean,invalidLabel:[String,Array]},Y={loading:Boolean,loadingLabel:String},M={disabled:Boolean},Z={readonly:Boolean},j={modifiers:[String,Array]},ee={hintLabel:{type:String,default:""}},q={options:{type:Array,default:()=>[]},labelKey:{type:[String,Function],default:"label"},valueKey:{type:[String,Function],default:"value"}},oe={LEFT:"left",RIGHT:"right"},te={icon:{type:[String,Object]},iconPosition:{type:String,validation:y=>Object.values(oe).includes(y),default:oe.RIGHT}},ne={tabindex:{type:[String,Number],default:0}},le={floating:Boolean},re={unselectable:{type:Boolean,default:!0}},z={id:[String,Number],name:{type:String,required:!0}},ae={autofocus:Boolean},ie={autocomplete:{type:String,default:"off"}},de={...z,...q,...M,...j,modelValue:{type:[String,Number,Boolean,Object,Array]},labelNoResults:{type:String,default:"No results"},multiple:Boolean,maxValues:[Number,String],unselectable:{type:Boolean,default:!0}},ce=["id"],ue={key:0,role:"option"},pe=["aria-selected"],me=["for","onClick"],fe=["id","type","value","checked","disabled","name"],be={name:"VvDropdown"},ge=e.defineComponent({...be,props:de,emits:["update:modelValue"],setup(y,{emit:a}){const o=y,V=computed(()=>String(o.id||w.nanoid())),{modifiers:c,disabled:p}=toRefs(o),{getOptionLabel:r,getOptionValue:S}=useOptions(o),{bemCssClasses:g}=useBemModifiers("vv-dropdown",{modifiers:c,disabled:p});function u(l){return Array.isArray(o.modelValue)?contains(l,o.modelValue)||contains(S(l),o.modelValue):equals(l,o.modelValue)||equals(S(l),o.modelValue)}function t(l){return typeof l=="string"||l.disabled===void 0?p.value:l.disabled}function n(l){var f;if(o.disabled)return;let i=l;if(o.multiple)if(Array.isArray(o.modelValue)){if(o.maxValues!==void 0&&o.maxValues>=0&&((f=o.modelValue)==null?void 0:f.length)>=o.maxValues&&!contains(l,o.modelValue))return;i=contains(l,o.modelValue)?removeFromList(l,o.modelValue):[...o.modelValue,l]}else i=[l];else o.unselectable&&l===o.modelValue&&(i=void 0);a("update:modelValue",i)}return(l,i)=>{var f;return e.openBlock(),e.createElementBlock("ul",{id:e.unref(V),class:e.normalizeClass(e.unref(g)),role:"listbox"},[(f=l.options)!=null&&f.length?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("li",ue,[e.createElementVNode("label",null,e.toDisplayString(l.labelNoResults),1)])),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(l.options,(m,B)=>(e.openBlock(),e.createElementBlock("li",{key:B,role:"option","aria-selected":u(m)},[e.createElementVNode("label",{for:`dropdown-${B}-${e.unref(V)}`,onClick:e.withModifiers(P=>n(e.unref(S)(m)),["prevent"])},[e.createElementVNode("input",{id:`dropdown-${B}-${e.unref(V)}`,type:l.multiple?"checkbox":"radio",value:e.unref(S)(m),checked:u(m),disabled:t(m),name:l.name,tabindex:"-1","aria-hidden":"true"},null,8,fe),e.createTextVNode(" "+e.toDisplayString(e.unref(r)(m)),1)],8,me)],8,pe))),128))],10,ce)}}}),he="ds",ye={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]}},Ve={name:"VvIcon"},A=e.defineComponent({...Ve,props:ye,setup(y){const a=y,o=ref(!0),{modifiers:V}=toRefs(a),c=inject(he),{bemCssClasses:p}=useBemModifiers("vv-icon",{modifiers:V}),r=computed(()=>a.provider||(c==null?void 0:c.provider)),S=computed(()=>{const t=a.name??"",n=`@${r.value}:${a.prefix}:${a.name}`;return _.iconExists(t)?t:_.iconExists(n)?n:(c==null?void 0:c.iconsCollections.find(l=>{const i=`@${r.value}:${l.prefix}:${t}`;if(_.iconExists(i))return i}))||t});function g(t){let n=null;if(typeof window>"u"){const{JSDOM:m}=require("jsdom");n=new m().window}return(n?new n.DOMParser:new window.DOMParser).parseFromString(t,"text/html").querySelector("svg")}function u(t){const n=g(t),l=(n==null?void 0:n.innerHTML.trim())||"";n&&l&&_.addIcon(`@${r.value}:${a.prefix}:${a.name}`,{body:l,height:n.viewBox.baseVal.height,width:n.viewBox.baseVal.width})}return c&&(a.src&&!_.iconExists(`@${r.value}:${a.prefix}:${a.name}`)?(o.value=!1,c.fetchIcon(a.src).then(t=>{t&&(u(t),o.value=!0)}).catch(t=>{throw new Error(`During fetch icon: ${t==null?void 0:t.message}`)})):a.svg&&u(a.svg)),(t,n)=>e.unref(o)?(e.openBlock(),e.createBlock(e.unref(_.Icon),e.mergeProps({key:0,class:e.unref(p)},{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(S)}),null,16,["class"])):e.createCommentVNode("",!0)}});function F(y){return Array.isArray(y)?y.filter(a=>isString(a)).join(" "):y}function se(y,a){const{invalid:o,valid:V,hint:c,loading:p}=a,{hintLabel:r,modelValue:S,valid:g,validLabel:u,invalid:t,invalidLabel:n,...l}=toRefs(y),i=resolveFieldData(l,"loading"),f=resolveFieldData(l,"loadingLabel"),m=computed(()=>t.value?!!(t.value&&o||n!=null&&n.value&&Array.isArray(n.value)&&n.value.length>0||n!=null&&n.value&&!isEmpty(n)):!1),B=computed(()=>!!(r&&r.value||c)),P=computed(()=>!!(u&&u.value||V)),C=computed(()=>!!(i!=null&&i.value&&p||i!=null&&i.value&&(f!=null&&f.value))),N=computed(()=>B.value||P.value||m.value||C.value);return{hasInvalid:m,hasHint:B,hasValid:P,hasLoading:C,HintSlot:{name:"HintSlot",props:{params:{type:Object,default:()=>({})}},setup(E){const I=computed(()=>{const k=toReactive({hintLabel:r,modelValue:S,valid:g,validLabel:u,invalid:t,invalidLabel:n,loading:i,loadingLabel:f,...E.params});return t!=null&&t.value?(o==null?void 0:o(k))||F(n==null?void 0:n.value)||(r==null?void 0:r.value):g!=null&&g.value?(V==null?void 0:V(k))||F(u==null?void 0:u.value)||(r==null?void 0:r.value):i!=null&&i.value?(p==null?void 0:p(k))||F(f==null?void 0:f.value)||(r==null?void 0:r.value):(c==null?void 0:c(k))||F(r==null?void 0:r.value)||(r==null?void 0:r.value)});return{isVisible:N,hasInvalid:m,hasValid:P,hintContent:I}},render(){if(this.isVisible)return h("small",{role:this.hasInvalid||this.hasValid?"alert":void 0},this.hintContent)}}}}const Se={...z,...ae,...ie,...ne,...Q,...W,...ee,...Y,...M,...Z,...j,...q,...te,...le,...re,multiple:Boolean,required:Boolean,size:[String,Number],modelValue:{type:[String,Number,Boolean,Object,Array],default:void 0},label:String,placeholder:String},Be=["update:modelValue","focus","blur"],ke=["for"],Pe={class:"vv-select__wrapper"},Ce=["id"],Ne=["disabled","hidden"],$e=["disabled","value"],we={name:"VvSelect"},_e=e.defineComponent({...we,props:Se,emits:Be,setup(y,{emit:a}){const o=y,V=useSlots(),c=ref(),{HintSlot:p,hasHint:r,hasInvalid:S}=se(o,V),{modifiers:g,disabled:u,readonly:t,loading:n,icon:l,iconPosition:i,invalid:f,valid:m,floating:B,multiple:P}=toRefs(o),C=computed(()=>String(o.id||w.nanoid())),N=computed(()=>`${C.value}-hint`),{focused:E}=useComponentFocus(c,a),I=useElementVisibility(c);watch(I,d=>{d&&o.autofocus&&(E.value=!0)});const{hasIcon:k,hasIconLeft:O,hasIconRight:R}=useComponentIcon(l,i),L=computed(()=>!isEmpty(o.modelValue)),T=computed(()=>o.disabled||o.readonly),K=computed(()=>T.value?-1:o.tabindex),x=computed(()=>{if(o.invalid===!0)return!0;if(o.valid===!0)return!1}),{bemCssClasses:H}=useBemModifiers("vv-select",{modifiers:g,valid:m,invalid:f,loading:n,disabled:u,readonly:t,iconLeft:O,iconRight:R,dirty:L,focus:E,floating:B,multiple:P}),U=computed(()=>({name:o.name,tabindex:K.value,disabled:T.value,required:o.required,size:o.size,autocomplete:o.autocomplete,multiple:o.multiple,"aria-invalid":x.value,"aria-describedby":!S.value&&r.value?N.value:void 0,"aria-errormessage":S.value?N.value:void 0})),{getOptionLabel:G,getOptionValue:J}=useOptions(o);function X(d){return typeof d=="string"||d.disabled===void 0?u.value:d.disabled}const v=computed({get:()=>o.modelValue,set:d=>{Array.isArray(d)&&(d=d.filter(D=>D!==void 0)),a("update:modelValue",d)}});return(d,D)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(e.unref(H))},[d.label?(e.openBlock(),e.createElementBlock("label",{key:0,for:e.unref(C)},e.toDisplayString(d.label),9,ke)):e.createCommentVNode("",!0),e.createElementVNode("div",Pe,[e.renderSlot(d.$slots,"before",{},()=>[e.unref(O)?(e.openBlock(),e.createBlock(A,e.normalizeProps(e.mergeProps({key:0},e.unref(k))),null,16)):e.createCommentVNode("",!0)]),e.withDirectives(e.createElementVNode("select",e.mergeProps({id:e.unref(C),ref_key:"select",ref:c,"onUpdate:modelValue":D[0]||(D[0]=s=>e.isRef(v)?v.value=s:null)},e.unref(U)),[d.placeholder?(e.openBlock(),e.createElementBlock("option",{key:0,value:void 0,disabled:!d.unselectable,hidden:!d.unselectable},e.toDisplayString(d.placeholder),9,Ne)):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(d.options,(s,b)=>(e.openBlock(),e.createElementBlock("option",{key:b,disabled:X(s),value:e.unref(J)(s)},e.toDisplayString(e.unref(G)(s)),9,$e))),128))],16,Ce),[[e.vModelSelect,e.unref(v)]]),e.renderSlot(d.$slots,"after",{},()=>[e.unref(R)?(e.openBlock(),e.createBlock(A,e.normalizeProps(e.mergeProps({key:0},e.unref(k))),null,16)):e.createCommentVNode("",!0)])]),e.createVNode(e.unref(p),{id:e.unref(N),class:"vv-select__hint"},null,8,["id"])],2))}}),Ee=["update:modelValue","change:search","focus","blur"],Ie={...z,...ne,...Q,...W,...ee,...Y,...M,...Z,...j,...q,...te,...le,...re,modelValue:{type:[String,Number,Boolean,Object,Array],default:void 0},label:String,labelNoResults:{type:String,default:"No results"},placeholder:String,searchable:Boolean,searchPlaceholder:String,debounceSearch:{type:[Number,String],default:0},multiple:Boolean,maxValues:[Number,String],separator:{type:String,default:", "},native:Boolean},De=["id"],Oe=["id","for"],ve=["tabindex"],Ae=["id","placeholder"],Fe={name:"VvCombobox"};return e.defineComponent({...Fe,props:Ie,emits:Ee,setup(y,{emit:a}){const o=y,V=useSlots(),{HintSlot:c}=se(o,V),p=ref(),r=ref(),{focused:S}=useComponentFocus(p,a),g=computed(()=>String(o.id||w.nanoid())),u=ref(""),t=refDebounced(u,Number(o.debounceSearch)),n=ref(!1),{icon:l,iconPosition:i,modifiers:f,disabled:m,readonly:B,loading:P,valid:C,invalid:N,floating:E}=toRefs(o);watch(t,()=>a("change:search",t.value));const{hasIcon:I,hasIconLeft:k,hasIconRight:O}=useComponentIcon(l,i),R=computed(()=>!isEmpty(o.modelValue)),L=computed(()=>m.value||B.value?-1:o.tabindex),{bemCssClasses:T}=useBemModifiers("vv-select",{modifiers:f,disabled:m,loading:P,readonly:B,iconLeft:k,iconRight:O,valid:C,invalid:N,dirty:R,focus:S,floating:E}),K=computed(()=>o.searchable?U.value:o.options),{getOptionLabel:x,getOptionValue:H}=useOptions(o),U=computed(()=>{var s;return(s=o.options)==null?void 0:s.filter(b=>x(b).toLowerCase().includes(t.value.toLowerCase().trim()))}),G=computed(()=>{let s=[];return Array.isArray(o.modelValue)?s=o.modelValue:o.modelValue&&(s=[o.modelValue]),o.options.filter(b=>s.includes(H(b)))}),J=computed(()=>G.value.map(s=>x(s)).join(o.separator));onClickOutside(p,()=>{p.value.open=!1});function X(s){const b=s.target;n.value=b.open}function v(s){p.value&&!o.multiple&&(p.value.open=!1),a("update:modelValue",s)}const d=computed(()=>({name:o.name,options:K.value,labelKey:o.labelKey,valueKey:o.valueKey,disabled:o.disabled,labelNoResults:o.labelNoResults,multiple:o.multiple,maxValues:o.maxValues,modelValue:o.modelValue,unselectable:o.unselectable})),D=computed(()=>({id:g.value,name:o.name,tabindex:L.value,valid:C.value,validLabel:o.validLabel,invalid:N.value,invalidLabel:o.invalidLabel,hintLabel:o.hintLabel,loading:P.value,loadingLabel:o.loadingLabel,disabled:m.value,readonly:B.value,modifiers:o.modifiers,options:K.value,labelKey:o.labelKey,valueKey:o.valueKey,icon:o.icon,iconPosition:o.iconPosition,floating:o.floating,unselectable:o.unselectable,multiple:o.multiple,label:o.label,placeholder:o.placeholder,modelValue:o.modelValue}));return(s,b)=>s.native?(e.openBlock(),e.createBlock(_e,e.mergeProps({key:1},e.unref(D),{"onUpdate:modelValue":b[4]||(b[4]=$=>a("update:modelValue",$))}),null,16)):(e.openBlock(),e.createElementBlock("div",{key:0,id:e.unref(g),class:e.normalizeClass(e.unref(T))},[s.label?(e.openBlock(),e.createElementBlock("label",{key:0,id:`${e.unref(g)}-label`,for:s.searchable&&e.unref(n)?`${e.unref(g)}-input`:void 0},e.toDisplayString(s.label),9,Oe)):e.createCommentVNode("",!0),e.createElementVNode("details",{ref_key:"dropdown",ref:p,class:"vv-select__wrapper",onClick:b[2]||(b[2]=$=>e.unref(m)||e.unref(B)?$.preventDefault():null),onKeyup:b[3]||(b[3]=e.withKeys($=>e.unref(p).open=!1,["esc"])),onToggle:X},[e.createElementVNode("summary",{class:"vv-select__input",tabindex:e.unref(L),onKeyup:b[1]||(b[1]=e.withKeys($=>s.searchable?$.preventDefault():null,["space"]))},[e.renderSlot(s.$slots,"before",{},()=>[e.unref(k)?(e.openBlock(),e.createBlock(A,e.mergeProps({key:0,class:"vv-select__icon-left"},e.unref(I)),null,16)):e.createCommentVNode("",!0)]),s.searchable&&e.unref(n)?e.withDirectives((e.openBlock(),e.createElementBlock("input",{key:0,id:`${e.unref(g)}-input`,ref_key:"inputSearch",ref:r,"onUpdate:modelValue":b[0]||(b[0]=$=>e.isRef(u)?u.value=$:null),role:"combobox",type:"search",placeholder:s.searchPlaceholder},null,8,Ae)),[[e.vModelText,e.unref(u)]]):(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[e.createTextVNode(e.toDisplayString(e.unref(J)||s.placeholder),1)],64)),e.renderSlot(s.$slots,"after",{},()=>[e.unref(O)?(e.openBlock(),e.createBlock(A,e.mergeProps({key:0,class:"vv-select__icon-right"},e.unref(I)),null,16)):e.createCommentVNode("",!0)])],40,ve),e.createVNode(ge,e.mergeProps({id:`${e.unref(g)}-dropdown`},e.unref(d),{"onUpdate:modelValue":v}),null,16,["id"])],544),e.createVNode(e.unref(c),{class:"vv-select__hint"})],10,De))}})});

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

@@ -1,6 +1,6 @@
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     modelValue: {
-        type: (ArrayConstructor | ObjectConstructor | StringConstructor | BooleanConstructor | NumberConstructor)[];
+        type: (StringConstructor | BooleanConstructor | ArrayConstructor | ObjectConstructor | NumberConstructor)[];
         default: undefined;
     };
     label: StringConstructor;
@@ -28,7 +28,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     };
     floating: BooleanConstructor;
     icon: {
-        type: (ObjectConstructor | StringConstructor)[];
+        type: (StringConstructor | ObjectConstructor)[];
     };
     iconPosition: {
         type: import("vue").PropType<import("../../props/index.js").IconPosition>;
@@ -57,9 +57,9 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         default: string;
     };
     invalid: BooleanConstructor;
-    invalidLabel: (ArrayConstructor | StringConstructor)[];
+    invalidLabel: (StringConstructor | ArrayConstructor)[];
     valid: BooleanConstructor;
-    validLabel: (ArrayConstructor | StringConstructor)[];
+    validLabel: (StringConstructor | ArrayConstructor)[];
     tabindex: {
         type: (StringConstructor | NumberConstructor)[];
         default: number;
@@ -71,7 +71,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     };
 }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, string[], string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     modelValue: {
-        type: (ArrayConstructor | ObjectConstructor | StringConstructor | BooleanConstructor | NumberConstructor)[];
+        type: (StringConstructor | BooleanConstructor | ArrayConstructor | ObjectConstructor | NumberConstructor)[];
         default: undefined;
     };
     label: StringConstructor;
@@ -99,7 +99,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     };
     floating: BooleanConstructor;
     icon: {
-        type: (ObjectConstructor | StringConstructor)[];
+        type: (StringConstructor | ObjectConstructor)[];
     };
     iconPosition: {
         type: import("vue").PropType<import("../../props/index.js").IconPosition>;
@@ -128,9 +128,9 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         default: string;
     };
     invalid: BooleanConstructor;
-    invalidLabel: (ArrayConstructor | StringConstructor)[];
+    invalidLabel: (StringConstructor | ArrayConstructor)[];
     valid: BooleanConstructor;
-    validLabel: (ArrayConstructor | StringConstructor)[];
+    validLabel: (StringConstructor | ArrayConstructor)[];
     tabindex: {
         type: (StringConstructor | NumberConstructor)[];
         default: number;

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

@@ -4,7 +4,7 @@ export declare const VvComboboxProps: {
      * modelValue can be a string, number, boolean, object or array of string, number, boolean, object
      */
     modelValue: {
-        type: (ArrayConstructor | ObjectConstructor | StringConstructor | BooleanConstructor | NumberConstructor)[];
+        type: (StringConstructor | BooleanConstructor | ArrayConstructor | ObjectConstructor | NumberConstructor)[];
         default: undefined;
     };
     /**
@@ -62,7 +62,7 @@ export declare const VvComboboxProps: {
     };
     floating: BooleanConstructor;
     icon: {
-        type: (ObjectConstructor | StringConstructor)[];
+        type: (StringConstructor | ObjectConstructor)[];
     };
     iconPosition: {
         type: import("vue").PropType<import("@/props").IconPosition>;
@@ -93,9 +93,9 @@ export declare const VvComboboxProps: {
         default: string;
     };
     invalid: BooleanConstructor;
-    invalidLabel: (ArrayConstructor | StringConstructor)[];
+    invalidLabel: (StringConstructor | ArrayConstructor)[];
     valid: BooleanConstructor;
-    validLabel: (ArrayConstructor | StringConstructor)[];
+    validLabel: (StringConstructor | ArrayConstructor)[];
     tabindex: {
         type: (StringConstructor | NumberConstructor)[];
         default: number;

package/dist/components/VvDialog/VvDialog.es.js

@@ -1,7 +1,6 @@
-import { computed as f, unref as l, defineComponent as V, ref as S, toRefs as B, inject as F, openBlock as h, createBlock as k, mergeProps as _, createCommentVNode as y, Transition as A, toHandlers as N, withCtx as z, withDirectives as E, createElementVNode as g, createElementBlock as C, renderSlot as w, createTextVNode as I, toDisplayString as M, withModifiers as P, createVNode as O, vShow as L } from "vue";
-import { useVModel as q, onClickOutside as T } from "@vueuse/core";
-import { iconExists as m, Icon as Z, addIcon as j } from "@iconify/vue";
-const H = "ds", R = {
+import { defineComponent as y, unref as i, openBlock as f, createBlock as V, mergeProps as w, createCommentVNode as _, Transition as b, toHandlers as D, withCtx as k, withDirectives as B, createElementVNode as u, createElementBlock as $, renderSlot as S, createTextVNode as F, toDisplayString as N, withModifiers as E, createVNode as I, vShow as P } from "vue";
+import { iconExists as p, Icon as M, addIcon as z } from "@iconify/vue";
+const O = "ds", L = {
   color: String,
   width: {
     type: [String, Number]
@@ -32,80 +31,45 @@ const H = "ds", R = {
   modifiers: {
     type: [String, Array]
   }
-};
-function b(i) {
-  var t, n;
-  if (i)
-    return (n = (t = i.match(
-      /[A-Z]{2,}(?=[A-Z][a-z]+[0-9]*|\b)|[A-Z]?[a-z]+[0-9]*|[A-Z]|[0-9]+/g
-    )) == null ? void 0 : t.join("-")) == null ? void 0 : n.toLowerCase();
-}
-function W(i, t) {
-  const n = { [`${i}`]: !0 };
-  return {
-    bemCssClasses: f(() => Object.keys(t).reduce((r, a) => {
-      const s = l(t[a]) || !1;
-      if (!s)
-        return r;
-      if (a === "modifiers") {
-        const p = Array.isArray(s) ? s : s.split(" ");
-        return {
-          ...r,
-          ...p.reduce(
-            (v, u) => ({
-              ...v,
-              [`${i}--${b(u)}`]: !0
-            }),
-            {}
-          )
-        };
-      } else
-        return {
-          ...r,
-          [`${i}--${b(a)}`]: s
-        };
-    }, n) || {})
-  };
-}
-const J = {
+}, q = {
   name: "VvIcon"
-}, X = /* @__PURE__ */ V({
-  ...J,
-  props: R,
-  setup(i) {
-    const t = i, n = S(!0), { modifiers: c } = B(t), r = F(H), { bemCssClasses: a } = W("vv-icon", {
-      modifiers: c
-    }), s = f(() => t.provider || (r == null ? void 0 : r.provider)), p = f(() => {
+}, T = /* @__PURE__ */ y({
+  ...q,
+  props: L,
+  setup(v) {
+    const t = v, r = ref(!0), { modifiers: a } = toRefs(t), n = inject(O), { bemCssClasses: c } = useBemModifiers("vv-icon", {
+      modifiers: a
+    }), s = computed(() => t.provider || (n == null ? void 0 : n.provider)), g = computed(() => {
       const e = t.name ?? "", o = `@${s.value}:${t.prefix}:${t.name}`;
-      return m(e) ? e : m(o) ? o : (r == null ? void 0 : r.iconsCollections.find((d) => {
-        const $ = `@${s.value}:${d.prefix}:${e}`;
-        if (m($))
-          return $;
+      return p(e) ? e : p(o) ? o : (n == null ? void 0 : n.iconsCollections.find((l) => {
+        const h = `@${s.value}:${l.prefix}:${e}`;
+        if (p(h))
+          return h;
       })) || e;
     });
-    function v(e) {
+    function m(e) {
       let o = null;
       if (typeof window > "u") {
-        const { JSDOM: D } = require("jsdom");
-        o = new D().window;
+        const { JSDOM: C } = require("jsdom");
+        o = new C().window;
       }
       return (o ? new o.DOMParser() : new window.DOMParser()).parseFromString(e, "text/html").querySelector("svg");
     }
-    function u(e) {
-      const o = v(e), d = (o == null ? void 0 : o.innerHTML.trim()) || "";
-      o && d && j(`@${s.value}:${t.prefix}:${t.name}`, {
-        body: d,
+    function d(e) {
+      const o = m(e), l = (o == null ? void 0 : o.innerHTML.trim()) || "";
+      o && l && z(`@${s.value}:${t.prefix}:${t.name}`, {
+        body: l,
         height: o.viewBox.baseVal.height,
         width: o.viewBox.baseVal.width
       });
     }
-    return r && (t.src && !m(`@${s.value}:${t.prefix}:${t.name}`) ? (n.value = !1, r.fetchIcon(t.src).then((e) => {
-      e && (u(e), n.value = !0);
+    return n && (t.src && !p(`@${s.value}:${t.prefix}:${t.name}`) ? (r.value = !1, n.fetchIcon(t.src).then((e) => {
+      e && (d(e), r.value = !0);
     }).catch((e) => {
       throw new Error(`During fetch icon: ${e == null ? void 0 : e.message}`);
-    })) : t.svg && u(t.svg)), (e, o) => n.value ? (h(), k(l(Z), _({
+    })) : t.svg && d(t.svg)), (e, o) => i(r) ? (f(), V(i(M), w({
       key: 0,
-      class: l(a)
+      class: i(c)
     }, {
       inline: e.inline,
       width: e.width,
@@ -116,79 +80,79 @@ const J = {
       rotate: e.rotate,
       color: e.color,
       onLoad: e.onLoad,
-      icon: l(p)
-    }), null, 16, ["class"])) : y("", !0);
+      icon: i(g)
+    }), null, 16, ["class"])) : _("", !0);
   }
-}), G = ["open", "close", "update:modelValue"], K = {
+}), A = ["open", "close", "update:modelValue"], H = {
   id: { type: String, required: !0 },
   title: String,
   modelValue: Boolean,
   transition: { type: String, default: "fade-block" },
   size: String,
   autoClose: { type: Boolean, default: !0 }
-}, Q = {
+}, R = {
   key: 0,
   class: "vv-dialog__header"
-}, U = ["onClick"], Y = { class: "vv-dialog__content" }, x = {
+}, W = ["onClick"], j = { class: "vv-dialog__content" }, J = {
   key: 1,
   class: "vv-dialog__footer"
-}, ee = {
+}, X = {
   name: "VvDialog"
-}, se = /* @__PURE__ */ V({
-  ...ee,
-  props: K,
-  emits: G,
-  setup(i, { emit: t }) {
-    const n = i, c = q(n, "modelValue", t), r = S(!0), a = S(null), s = f(() => {
-      const { id: o } = n;
+}, U = /* @__PURE__ */ y({
+  ...X,
+  props: H,
+  emits: A,
+  setup(v, { emit: t }) {
+    const r = v, a = useVModel(r, "modelValue", t), n = ref(!0), c = ref(null), s = computed(() => {
+      const { id: o } = r;
       return {
         id: o,
-        open: r.value
+        open: n.value
       };
-    }), p = f(() => n.size ? ["vv-dialog", `vv-dialog--${n.size}`] : "vv-dialog"), v = f(() => `vv-dialog--${n.transition}`), u = {
+    }), g = computed(() => r.size ? ["vv-dialog", `vv-dialog--${r.size}`] : "vv-dialog"), m = computed(() => `vv-dialog--${r.transition}`), d = {
       "before-enter": () => {
-        r.value = !0, t("open");
+        n.value = !0, t("open");
       },
       "after-leave": () => {
-        r.value = !1, t("close");
+        n.value = !1, t("close");
       }
     };
-    T(a, () => {
-      n.autoClose && (c.value = !1);
+    onClickOutside(c, () => {
+      r.autoClose && (a.value = !1);
     });
     function e() {
-      c.value = !1;
+      a.value = !1;
     }
-    return (o, d) => (h(), k(A, _({ name: l(v) }, N(u)), {
-      default: z(() => [
-        E(g("dialog", _(l(s), { class: l(p) }), [
-          g("article", {
+    return (o, l) => (f(), V(b, w({ name: i(m) }, D(d)), {
+      default: k(() => [
+        B(u("dialog", w(i(s), { class: i(g) }), [
+          u("article", {
             ref_key: "modalWrapper",
-            ref: a,
+            ref: c,
             class: "vv-dialog__wrapper"
           }, [
-            o.$slots.header || o.title ? (h(), C("header", Q, [
-              w(o.$slots, "header", {}, () => [
-                I(M(o.title) + " ", 1),
-                g("button", {
+            o.$slots.header || o.title ? (f(), $("header", R, [
+              S(o.$slots, "header", {}, () => [
+                F(N(o.title) + " ", 1),
+                u("button", {
                   type: "button",
                   "aria-label": "Close",
                   class: "vv-dialog__close",
-                  onClick: P(e, ["prevent"])
+                  onClick: E(e, ["prevent"])
                 }, [
-                  O(X, { name: "close" })
-                ], 8, U)
+                  I(T, { name: "close" })
+                ], 8, W)
               ])
-            ])) : y("", !0),
-            g("div", Y, [
-              w(o.$slots, "default")
+            ])) : _("", !0),
+            u("div", j, [
+              S(o.$slots, "default")
             ]),
-            o.$slots.footer ? (h(), C("footer", x, [
-              w(o.$slots, "footer")
-            ])) : y("", !0)
+            o.$slots.footer ? (f(), $("footer", J, [
+              S(o.$slots, "footer")
+            ])) : _("", !0)
           ], 512)
         ], 16), [
-          [L, l(c)]
+          [P, i(a)]
         ])
       ]),
       _: 3
@@ -196,5 +160,5 @@ const J = {
   }
 });
 export {
-  se as default
+  U as default
 };

package/dist/components/VvDialog/VvDialog.umd.js

@@ -1 +1 @@
-(function(e,c){typeof exports=="object"&&typeof module<"u"?module.exports=c(require("vue"),require("@vueuse/core"),require("@iconify/vue")):typeof define=="function"&&define.amd?define(["vue","@vueuse/core","@iconify/vue"],c):(e=typeof globalThis<"u"?globalThis:e||self,e.VvDialog=c(e.vue,e.core,e.vue$1))})(this,function(e,c,d){"use strict";const w="ds",y={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]}};function S(l){var n,i;if(l)return(i=(n=l.match(/[A-Z]{2,}(?=[A-Z][a-z]+[0-9]*|\b)|[A-Z]?[a-z]+[0-9]*|[A-Z]|[0-9]+/g))==null?void 0:n.join("-"))==null?void 0:i.toLowerCase()}function _(l,n){const i={[`${l}`]:!0};return{bemCssClasses:e.computed(()=>Object.keys(n).reduce((r,a)=>{const s=e.unref(n[a])||!1;if(!s)return r;if(a==="modifiers"){const u=Array.isArray(s)?s:s.split(" ");return{...r,...u.reduce((g,p)=>({...g,[`${l}--${S(p)}`]:!0}),{})}}else return{...r,[`${l}--${S(a)}`]:s}},i)||{})}}const C={name:"VvIcon"},V=e.defineComponent({...C,props:y,setup(l){const n=l,i=e.ref(!0),{modifiers:f}=e.toRefs(n),r=e.inject(w),{bemCssClasses:a}=_("vv-icon",{modifiers:f}),s=e.computed(()=>n.provider||(r==null?void 0:r.provider)),u=e.computed(()=>{const o=n.name??"",t=`@${s.value}:${n.prefix}:${n.name}`;return d.iconExists(o)?o:d.iconExists(t)?t:(r==null?void 0:r.iconsCollections.find(m=>{const h=`@${s.value}:${m.prefix}:${o}`;if(d.iconExists(h))return h}))||o});function g(o){let t=null;if(typeof window>"u"){const{JSDOM:D}=require("jsdom");t=new D().window}return(t?new t.DOMParser:new window.DOMParser).parseFromString(o,"text/html").querySelector("svg")}function p(o){const t=g(o),m=(t==null?void 0:t.innerHTML.trim())||"";t&&m&&d.addIcon(`@${s.value}:${n.prefix}:${n.name}`,{body:m,height:t.viewBox.baseVal.height,width:t.viewBox.baseVal.width})}return r&&(n.src&&!d.iconExists(`@${s.value}:${n.prefix}:${n.name}`)?(i.value=!1,r.fetchIcon(n.src).then(o=>{o&&(p(o),i.value=!0)}).catch(o=>{throw new Error(`During fetch icon: ${o==null?void 0:o.message}`)})):n.svg&&p(n.svg)),(o,t)=>i.value?(e.openBlock(),e.createBlock(e.unref(d.Icon),e.mergeProps({key:0,class:e.unref(a)},{inline:o.inline,width:o.width,height:o.height,horizontalFlip:o.horizontalFlip,verticalFlip:o.verticalFlip,flip:o.flip,rotate:o.rotate,color:o.color,onLoad:o.onLoad,icon:e.unref(u)}),null,16,["class"])):e.createCommentVNode("",!0)}}),$=["open","close","update:modelValue"],k={id:{type:String,required:!0},title:String,modelValue:Boolean,transition:{type:String,default:"fade-block"},size:String,autoClose:{type:Boolean,default:!0}},b={key:0,class:"vv-dialog__header"},B=["onClick"],E={class:"vv-dialog__content"},v={key:1,class:"vv-dialog__footer"},N={name:"VvDialog"};return e.defineComponent({...N,props:k,emits:$,setup(l,{emit:n}){const i=l,f=c.useVModel(i,"modelValue",n),r=e.ref(!0),a=e.ref(null),s=e.computed(()=>{const{id:t}=i;return{id:t,open:r.value}}),u=e.computed(()=>i.size?["vv-dialog",`vv-dialog--${i.size}`]:"vv-dialog"),g=e.computed(()=>`vv-dialog--${i.transition}`),p={"before-enter":()=>{r.value=!0,n("open")},"after-leave":()=>{r.value=!1,n("close")}};c.onClickOutside(a,()=>{i.autoClose&&(f.value=!1)});function o(){f.value=!1}return(t,m)=>(e.openBlock(),e.createBlock(e.Transition,e.mergeProps({name:e.unref(g)},e.toHandlers(p)),{default:e.withCtx(()=>[e.withDirectives(e.createElementVNode("dialog",e.mergeProps(e.unref(s),{class:e.unref(u)}),[e.createElementVNode("article",{ref_key:"modalWrapper",ref:a,class:"vv-dialog__wrapper"},[t.$slots.header||t.title?(e.openBlock(),e.createElementBlock("header",b,[e.renderSlot(t.$slots,"header",{},()=>[e.createTextVNode(e.toDisplayString(t.title)+" ",1),e.createElementVNode("button",{type:"button","aria-label":"Close",class:"vv-dialog__close",onClick:e.withModifiers(o,["prevent"])},[e.createVNode(V,{name:"close"})],8,B)])])):e.createCommentVNode("",!0),e.createElementVNode("div",E,[e.renderSlot(t.$slots,"default")]),t.$slots.footer?(e.openBlock(),e.createElementBlock("footer",v,[e.renderSlot(t.$slots,"footer")])):e.createCommentVNode("",!0)],512)],16),[[e.vShow,e.unref(f)]])]),_:3},16,["name"]))}})});
+(function(e,i){typeof exports=="object"&&typeof module<"u"?module.exports=i(require("vue"),require("@iconify/vue")):typeof define=="function"&&define.amd?define(["vue","@iconify/vue"],i):(e=typeof globalThis<"u"?globalThis:e||self,e.VvDialog=i(e.vue,e.vue$1))})(this,function(e,i){"use strict";const h="ds",S={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]}},w={name:"VvIcon"},_=e.defineComponent({...w,props:S,setup(p){const n=p,s=ref(!0),{modifiers:c}=toRefs(n),r=inject(h),{bemCssClasses:d}=useBemModifiers("vv-icon",{modifiers:c}),l=computed(()=>n.provider||(r==null?void 0:r.provider)),m=computed(()=>{const o=n.name??"",t=`@${l.value}:${n.prefix}:${n.name}`;return i.iconExists(o)?o:i.iconExists(t)?t:(r==null?void 0:r.iconsCollections.find(a=>{const u=`@${l.value}:${a.prefix}:${o}`;if(i.iconExists(u))return u}))||o});function g(o){let t=null;if(typeof window>"u"){const{JSDOM:E}=require("jsdom");t=new E().window}return(t?new t.DOMParser:new window.DOMParser).parseFromString(o,"text/html").querySelector("svg")}function f(o){const t=g(o),a=(t==null?void 0:t.innerHTML.trim())||"";t&&a&&i.addIcon(`@${l.value}:${n.prefix}:${n.name}`,{body:a,height:t.viewBox.baseVal.height,width:t.viewBox.baseVal.width})}return r&&(n.src&&!i.iconExists(`@${l.value}:${n.prefix}:${n.name}`)?(s.value=!1,r.fetchIcon(n.src).then(o=>{o&&(f(o),s.value=!0)}).catch(o=>{throw new Error(`During fetch icon: ${o==null?void 0:o.message}`)})):n.svg&&f(n.svg)),(o,t)=>e.unref(s)?(e.openBlock(),e.createBlock(e.unref(i.Icon),e.mergeProps({key:0,class:e.unref(d)},{inline:o.inline,width:o.width,height:o.height,horizontalFlip:o.horizontalFlip,verticalFlip:o.verticalFlip,flip:o.flip,rotate:o.rotate,color:o.color,onLoad:o.onLoad,icon:e.unref(m)}),null,16,["class"])):e.createCommentVNode("",!0)}}),v=["open","close","update:modelValue"],y={id:{type:String,required:!0},title:String,modelValue:Boolean,transition:{type:String,default:"fade-block"},size:String,autoClose:{type:Boolean,default:!0}},V={key:0,class:"vv-dialog__header"},$=["onClick"],C={class:"vv-dialog__content"},k={key:1,class:"vv-dialog__footer"},B={name:"VvDialog"};return e.defineComponent({...B,props:y,emits:v,setup(p,{emit:n}){const s=p,c=useVModel(s,"modelValue",n),r=ref(!0),d=ref(null),l=computed(()=>{const{id:t}=s;return{id:t,open:r.value}}),m=computed(()=>s.size?["vv-dialog",`vv-dialog--${s.size}`]:"vv-dialog"),g=computed(()=>`vv-dialog--${s.transition}`),f={"before-enter":()=>{r.value=!0,n("open")},"after-leave":()=>{r.value=!1,n("close")}};onClickOutside(d,()=>{s.autoClose&&(c.value=!1)});function o(){c.value=!1}return(t,a)=>(e.openBlock(),e.createBlock(e.Transition,e.mergeProps({name:e.unref(g)},e.toHandlers(f)),{default:e.withCtx(()=>[e.withDirectives(e.createElementVNode("dialog",e.mergeProps(e.unref(l),{class:e.unref(m)}),[e.createElementVNode("article",{ref_key:"modalWrapper",ref:d,class:"vv-dialog__wrapper"},[t.$slots.header||t.title?(e.openBlock(),e.createElementBlock("header",V,[e.renderSlot(t.$slots,"header",{},()=>[e.createTextVNode(e.toDisplayString(t.title)+" ",1),e.createElementVNode("button",{type:"button","aria-label":"Close",class:"vv-dialog__close",onClick:e.withModifiers(o,["prevent"])},[e.createVNode(_,{name:"close"})],8,$)])])):e.createCommentVNode("",!0),e.createElementVNode("div",C,[e.renderSlot(t.$slots,"default")]),t.$slots.footer?(e.openBlock(),e.createElementBlock("footer",k,[e.renderSlot(t.$slots,"footer")])):e.createCommentVNode("",!0)],512)],16),[[e.vShow,e.unref(c)]])]),_:3},16,["name"]))}})});