UNPKG

@volverjs/ui-vue

Version:

@volverjs/ui-vue is a lightweight Vue 3 component library to accompany @volverjs/style.

2 lines (1 loc) 2.91 kB
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("vue")):"function"==typeof define&&define.amd?define(["vue"],t):(e="undefined"!=typeof globalThis?globalThis:e||self).VvAvatarGroup=t(e.vue)}(this,function(e){"use strict";var t=(e=>(e.local="local",e.session="session",e))(t||{}),r=(e=>(e.left="left",e.right="right",e.top="top",e.bottom="bottom",e))(r||{}),o=(e=>(e.before="before",e.after="after",e))(o||{}),a=(e=>(e.button="button",e.submit="submit",e.reset="reset",e))(a||{}),n=(e=>(e.nuxtLink="nuxt-link",e.routerLink="router-link",e.a="a",e.button="button",e))(n||{});const i={modifiers:{type:[String,Array],default:void 0}};o.before,r.bottom,a.button,n.button,t.local;const l={...i,imgSrc:String};function s(t,r,o){return e.computed(()=>{const e={[t]:!0},o="string"==typeof r?.value?r.value.split(" "):r?.value;return o&&Array.isArray(o)&&o.forEach(r=>{r&&(e[`${t}--${r}`]=!0)}),e})}const u=["role","aria-label"],f=["src"],c=e.defineComponent({name:"VvAvatar",props:l,setup(t){const r=t,{modifiers:o}=e.toRefs(r),a=s("vv-avatar",o);return(t,r)=>(e.openBlock(),e.createElementBlock("span",{class:e.normalizeClass(e.unref(a)),role:t.imgSrc?void 0:"img","aria-label":t.imgSrc?void 0:"avatar"},[e.renderSlot(t.$slots,"default",{},()=>[t.imgSrc?(e.openBlock(),e.createElementBlock("img",{key:0,src:t.imgSrc,alt:"avatar"},null,8,f)):e.createCommentVNode("v-if",!0)])],10,u))}}),m={...i,items:{type:Array,default:()=>[],required:!0},toShow:{type:Number,default:3},totalItems:{type:Number},avatarModifiers:[String,Array]};const d={key:0};return e.defineComponent({name:"VvAvatarGroup",props:m,setup(t){const r=t,{modifiers:o,items:a,toShow:n,totalItems:i,avatarModifiers:l}=e.toRefs(r),u=s("vv-avatar-group",o),f=e.computed(()=>l?.value&&Array.isArray(l?.value)?l.value.join(" "):l?.value||""),m=e.computed(()=>a.value.slice(0,n.value).map(t=>{let r=[],o=[];return l?.value&&(r=Array.isArray(l?.value)?l?.value:[l?.value]),t.modifiers&&(o=Array.isArray(t.modifiers)?t.modifiers:[t.modifiers]),{...t,key:t.key||e.computed(()=>String(e.useId())).value,modifiers:[...r,...o]}}));return(t,r)=>(e.openBlock(),e.createElementBlock("span",{class:e.normalizeClass(e.unref(u))},[e.renderSlot(t.$slots,"default",{},()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(m),t=>(e.openBlock(),e.createBlock(c,e.mergeProps({key:t.key},{ref_for:!0},{modifiers:t.modifiers,imgSrc:t.imgSrc}),{default:e.withCtx(()=>[t.text?(e.openBlock(),e.createElementBlock("span",d,e.toDisplayString(t.text),1)):e.createCommentVNode("v-if",!0)]),_:2},1040))),128)),(e.unref(i)||e.unref(a).length)>e.unref(n)?(e.openBlock(),e.createBlock(c,{key:0,modifiers:`${e.unref(f)} surface bordered`},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString("+"+((e.unref(i)||e.unref(a).length)-e.unref(n))),1)]),_:1},8,["modifiers"])):e.createCommentVNode("v-if",!0)])],2))}})});