@volverjs/ui-vue
Version:
@volverjs/ui-vue is a lightweight Vue 3 component library to accompany @volverjs/style.
2 lines (1 loc) • 19.6 kB
JavaScript
import{computed as e,isRef as l,defineComponent as t,h as a,inject as i,toRef as o,toRefs as n,getCurrentInstance as r,ref as u,watch as s,resolveComponent as v,createBlock as d,openBlock as c,resolveDynamicComponent as f,unref as p,mergeProps as b,withCtx as g,renderSlot as y,createTextVNode as m,toDisplayString as h,mergeDefaults as L,createCommentVNode as S,useId as k,useAttrs as A,useSlots as $,createElementBlock as w,Fragment as B,onBeforeUnmount as O,normalizeClass as _,createElementVNode as x,createVNode as I,withModifiers as V,normalizeProps as j,guardReactiveProps as R,createSlots as C}from"vue";import{useVModel as N}from"@vueuse/core";import D from"vuedraggable";import{iconLoaded as F,Icon as P,addIcon as E}from"@iconify/vue";const U="add",M="edit",T="download",q={prefix:"normal"};var G=/* @__PURE__ */(e=>(e.local="local",e.session="session",e))(G||{}),H=/* @__PURE__ */(e=>(e.left="left",e.right="right",e.top="top",e.bottom="bottom",e))(H||{}),z=/* @__PURE__ */(e=>(e.before="before",e.after="after",e))(z||{}),J=/* @__PURE__ */(e=>(e.button="button",e.submit="submit",e.reset="reset",e))(J||{}),W=/* @__PURE__ */(e=>(e.nuxtLink="nuxt-link",e.routerLink="router-link",e.a="a",e.button="button",e))(W||{});const K=Symbol.for("volver"),Y=Symbol.for("buttonGroup"),Z=Symbol.for("dropdownTrigger"),Q=Symbol.for("dropdownAction"),X={to:{type:[String,Object]},href:String,target:String,rel:{type:String,default:"noopener noreferrer"}},ee={valid:{type:Boolean,default:!1},validLabel:{type:[String,Array],default:void 0}},le={invalid:{type:Boolean,default:!1},invalidLabel:{type:[String,Array],default:void 0}},te={loading:{type:Boolean,default:!1},loadingLabel:{type:String,default:"Loading..."}},ae={disabled:{type:Boolean,default:!1}},ie={required:{type:Boolean,default:!1}},oe={active:{type:Boolean,default:!1}},ne={current:{type:Boolean,default:!1}},re={pressed:{type:Boolean,default:!1}},ue={label:{type:[String,Number],default:void 0}},se={readonly:{type:Boolean,default:!1}},ve={modifiers:{type:[String,Array],default:void 0}},de={hintLabel:{type:String,default:""}},ce={icon:{type:[String,Object],default:void 0},iconPosition:{type:String,default:z.before,validation:e=>Object.values(z).includes(e)}},fe={unselectable:{type:Boolean,default:!0}},pe={id:[String,Number]};H.bottom;const be={...pe,name:{type:String,required:!0}},ge={...ae,...ue,...re,...oe,...ne,...X,type:{type:String,default:J.button,validator:e=>Object.values(J).includes(e)},ariaLabel:{type:String,default:void 0},defaultTag:{type:String,default:W.button}};G.local;const ye={...be,...ve,...ee,...le,...de,...ue,...te,...se,...ae,...ie,...ce,modelValue:{type:Object},progress:{type:[Number,String],default:void 0},placeholder:{type:String,default:void 0},accept:{type:String,default:"*"},multiple:{type:Boolean,default:!1},capture:{type:String,default:void 0,validation:e=>void 0===e||["user","environment"].includes(e)},max:{type:[Number,String],default:void 0},dropArea:{type:Boolean,default:!1},sortable:{type:Boolean,default:!1},labelAdd:{type:String,default:"Add file"},iconAdd:{type:[String,Object],default:U},labelReplace:{type:String,default:"Replace file"},iconReplace:{type:[String,Object],default:M},labelDownload:{type:String,default:"Downlaod file"},iconDownload:{type:[String,Object],default:T},labelRemove:{type:String,default:"Remove file"}};function me(e,l,t){return he(e,l)}function he(e,l){if(e===l)return!0;if(e&&l&&"object"==typeof e&&"object"==typeof l){const t=Array.isArray(e),a=Array.isArray(l);let i,o,n;if(t&&a){if(o=e.length,o!==l.length)return!1;for(i=o;0!==i--;)if(!he(e[i],l[i]))return!1;return!0}if(t!==a)return!1;const r=e instanceof Date,u=l instanceof Date;if(r!==u)return!1;if(r&&u)return e.getTime()===l.getTime();const s=e instanceof RegExp,v=l instanceof RegExp;if(s!==v)return!1;if(s&&v)return e.toString()===l.toString();const d=Object.keys(e);if(o=d.length,o!==Object.keys(l).length)return!1;for(i=o;0!==i--;)if(!Object.prototype.hasOwnProperty.call(l,d[i]))return!1;for(i=o;0!==i--;)if(n=d[i],!he(e[n],l[n]))return!1;return!0}return Number.isNaN(e)&&Number.isNaN(l)}function Le(e,l){if(null!=e&&l&&l.length)for(const t of l)if(me(e,t))return!0;return!1}function Se(e){return Array.isArray(e)?e.filter(e=>"string"==typeof e).join(" "):e}const ke={...ge,...pe,...ve,...fe,...te,...ce,iconPosition:{type:String,default:H.left,validator:e=>Object.values(H).includes(e)},loadingIcon:{type:String,default:"eos-icons:bubble-loading"},toggle:{type:Boolean,default:!1},value:{type:[String,Number,Boolean],default:void 0},uncheckedValue:{type:[String,Number,Boolean],default:void 0},modelValue:{type:[String,Number,Boolean],default:void 0}};function Ae(l,t){const{group:a,isInGroup:r,getGroupOrLocalRef:u}=function(l){const t=i(l,void 0),a=e(()=>void 0!==t);return{group:t,isInGroup:a,getGroupOrLocalRef:function(l,a,i){const n=t?.[l];if(n)return e({get:()=>n.value,set(e){n.value=e}});const r=o(a,l);return e({get:()=>r.value,set(e){i&&i(`update:${l}`,e)}})}}}(Y),{id:s,iconPosition:v,icon:d,label:c,pressed:f}=n(l),p=u("modelValue",l,t),b=u("toggle",l),g=u("unselectable",l),y=e(()=>a?.multiple.value??!1),m=e(()=>{let e=l.modifiers,t=a?.modifiers.value;const i=/* @__PURE__ */new Set;return e&&(Array.isArray(e)||(e=e.split(" ")),e.forEach(e=>i.add(e))),t&&(Array.isArray(t)||(t=t.split(" ")),t.forEach(e=>i.add(e))),Array.from(i)}),h=e(()=>Boolean(l.disabled||a?.disabled.value));return{group:a,isInGroup:r,modelValue:p,toggle:b,unselectable:g,multiple:y,modifiers:m,disabled:h,id:s,pressed:f,iconPosition:v,icon:d,label:c}}function $e(){return i(K,void 0)}const we=/* @__PURE__ */t({name:"VvAction",props:ge,emits:["click","mouseover","mouseleave"],setup(l,{expose:t,emit:a}){const o=l,n=a,L=r(),S=$e(),k=u(null);t({$el:k});const{reference:A,bus:$,aria:w,expanded:B}=i(Z,{});s(()=>k.value,e=>{A&&(A.value=e)});const O=e(()=>o.pressed||B?.value),{role:_}=i(Q,{}),x=e(()=>{switch(!0){case o.disabled:return W.button;case void 0!==o.to:return S?.nuxt?v(W.nuxtLink):W.routerLink;case void 0!==o.href:return W.a;default:return o.defaultTag}}),I=e(()=>{const e={...w?.value,ariaPressed:!!O.value||void 0,ariaLabel:o.ariaLabel,role:_?.value};switch(x.value){case W.a:return{...e,href:o.href,target:o.target,rel:o.rel};case W.routerLink:case W.nuxtLink:return{...e,to:o.to,target:o.target};case W.button:return{...e,type:o.type,disabled:o.disabled};default:return e}});function V(e){o.disabled?e.preventDefault():L?.vnode.props?.onClick?n("click",e):$?.emit("click",e)}function j(e){L?.vnode.props?.onMouseover?n("mouseover",e):$?.emit("mouseover",e)}function R(e){L?.vnode.props?.onMouseleave?n("mouseleave",e):$?.emit("mouseleave",e)}return(e,l)=>(c(),d(f(p(x)),b(p(I),{ref_key:"element",ref:k,class:{active:e.active,pressed:p(O),disabled:e.disabled,current:e.current},onClickPassive:V,onMouseoverPassive:j,onMouseleavePassive:R}),{default:g(()=>[y(e.$slots,"default",{},()=>[m(h(e.label),1)])]),_:3},16,["class"]))}});function Be(l,t,a){return e(()=>{const e={[l]:!0},i="string"==typeof t?.value?t.value.split(" "):t?.value;return i&&Array.isArray(i)&&i.forEach(t=>{t&&(e[`${l}--${t}`]=!0)}),a&&Object.keys(a.value).forEach(t=>{e[`${l}--${t}`]=p(a.value[t])}),e})}const Oe=/* @__PURE__ */t({name:"VvIcon",props:/* @__PURE__ */L({name:{},color:{},width:{},height:{},provider:{},prefix:{},src:{},horizontalFlip:{type:Boolean},verticalFlip:{type:Boolean},flip:{},mode:{},inline:{type:Boolean},rotate:{},onLoad:{type:Function},svg:{},modifiers:{}},q),setup(l){const t=l,a=e(()=>"string"==typeof t.rotate?Number.parseFloat(t.rotate):t.rotate),i=u(!0),o=$e(),{modifiers:r}=n(t),s=Be("vv-icon",r),v=e(()=>t.provider||o?.iconsProvider),f=e(()=>{const e=t.name??"",l=`@${v.value}:${t.prefix}:${e}`;if(F(l))return l;const a=o?.iconsCollections.find(l=>{const t=`@${v.value}:${l.prefix}:${e}`;return F(t)});return a?`@${v.value}:${a.prefix}:${e}`:e});function g(e){const l=function(e){let l;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),a=l?.innerHTML.trim()||"";l&&a&&E(`@${v.value}:${t.prefix}:${t.name}`,{body:a,height:l.viewBox.baseVal.height,width:l.viewBox.baseVal.width})}return o&&t.src&&!F(`@${v.value}:${t.prefix}:${t.name}`)&&(i.value=!1,o.fetchIcon(t.src).then(e=>{e&&(g(e),i.value=!0)}).catch(e=>{throw new Error(`Error during fetch icon: ${e?.message}`)})),t.svg&&g(t.svg),(e,t)=>p(i)?(c(),d(p(P),b({key:0,class:p(s)},{inline:l.inline,width:l.width,height:l.height,horizontalFlip:l.horizontalFlip,verticalFlip:l.verticalFlip,flip:l.flip,rotate:p(a),color:l.color,icon:p(f)},{onLoad:l.onLoad}),null,16,["class","onLoad"])):S("v-if",!0)}});function _e(l){return e(()=>String(l?.value||k()))}function xe(l,t){const a=e(()=>"string"==typeof l?.value?{name:l?.value}:l?.value),i=e(()=>t?.value===z.before?a.value:void 0),o=e(()=>t?.value===z.after?a.value:void 0),n=e(()=>t?.value===H.left?a.value:void 0),r=e(()=>t?.value===H.right?a.value:void 0),u=e(()=>t?.value===H.top?a.value:void 0),s=e(()=>t?.value===H.bottom?a.value:void 0);return{hasIcon:a,hasIconLeft:n,hasIconRight:r,hasIconTop:u,hasIconBottom:s,hasIconBefore:i,hasIconAfter:o}}const Ie={key:1,class:"vv-button__label"},Ve={key:1,class:"vv-button__label"},je=/* @__PURE__ */t({name:"VvButton",inheritAttrs:!1,props:ke,emits:["update:modelValue"],setup(l,{expose:t,emit:a}){const i=l,o=a,n=A(),r=$(),{id:s,modifiers:v,iconPosition:f,icon:L,label:k,modelValue:O,disabled:_,toggle:x,unselectable:I}=Ae(i,o),V=_e(s),j=e(()=>n?.name||V.value),R=u(null);t({$el:e(()=>R.value?.$el)});const C=e(()=>x.value?Array.isArray(O.value)?Le(j.value,O.value):me(j.value,O.value):i.pressed),N=Be("vv-button",v,e(()=>({reverse:[H.right,H.bottom].includes(f.value),column:[H.top,H.bottom].includes(f.value),"icon-only":Boolean(L?.value&&!k?.value&&!r.default)}))),{hasIcon:D}=xe(L),F=e(()=>void 0!==i.value?i.value:j.value),P=e(()=>{if(x.value)return{onClick:E}});function E(){if(x.value){if(Array.isArray(O.value))return Le(F.value,O.value)?void(I.value&&(O.value=O.value.filter(e=>e!==F.value))):void O.value.push(F.value);if(F.value===O.value&&I.value)return void(O.value=i.uncheckedValue);O.value=F.value}}return(e,l)=>(c(),d(we,b({...p(n),...p(P),disabled:p(_),pressed:p(C),active:e.active,type:e.type,to:e.to,href:e.href,target:e.target,rel:e.rel,ariaLabel:e.ariaLabel},{id:p(V),ref_key:"element",ref:R,class:p(N)}),{default:g(()=>[y(e.$slots,"default",{},()=>[e.loading?y(e.$slots,"loading",{key:0},()=>[e.loadingIcon?(c(),d(Oe,{key:0,class:"vv-button__loading-icon",name:e.loadingIcon},null,8,["name"])):S("v-if",!0),e.loadingLabel?(c(),w("span",Ie,h(e.loadingLabel),1)):S("v-if",!0)]):(c(),w(B,{key:1},[y(e.$slots,"before"),p(D)?(c(),d(Oe,b({key:0},p(D),{class:"vv-button__icon"}),null,16)):S("v-if",!0),p(k)?(c(),w("span",Ve,[y(e.$slots,"label",{},()=>[m(h(p(k)),1)])])):S("v-if",!0),y(e.$slots,"after")],64))])]),_:3},16,["id","class"]))}});const Re=["for"],Ce={class:"vv-input-file__preview"},Ne=["src","alt"],De={class:"vv-input-file__wrapper"},Fe=["id","readonly","disabled","required","placeholder","aria-describedby","aria-invalid","aria-errormessage","multiple","accept","capture","name"],Pe=["value"],Ee=["onClick"],Ue=["title","onClick"],Me={class:"vv-input-file__item-name"},Te={class:"vv-input-file__item-info"},qe=["title","disabled","onClick"],Ge=/* @__PURE__ */t({name:"VvInputFile",props:ye,emits:["remove","download","update:modelValue"],setup(i,{emit:o}){const r=i,v=o,f=$(),m=function(l,t,a){const i=$e(),o=e(()=>{if(i&&i.defaults.value?.[l])return i.defaults.value[l]});return e(()=>{if(void 0===o.value)return a;const e=o.value,l=t,i=a;return Object.keys(l).reduce((t,a)=>{const o=i[a];if(t[a]=o,a in e){if(Array.isArray(l[a])){const i=l[a];i.length&&i[0]===o&&(t[a]=e[a])}if("function"==typeof l[a]&&(0,l[a])()===o&&(t[a]=e[a]),"object"==typeof l[a]){let i=l[a].default;"function"==typeof i&&(i=i()),"object"==typeof i?JSON.stringify(i)===JSON.stringify(o)&&(t[a]=e[a]):i===o&&(t[a]=e[a])}}return t},{})})}("VvInputFile",ye,r),{modifiers:L,id:k,readonly:A,disabled:B,icon:F,iconPosition:P,iconDownload:E}=n(r),U=_e(k),M=e(()=>`${U.value}-hint`),T=e(()=>{if(!r.progress)return!1;const e="string"==typeof r.progress?Number.parseInt(r.progress):r.progress;return e>0&&e<100}),{hasIconBefore:q,hasIconAfter:G}=xe(F,P),{hasIcon:H}=xe(E),z=Be("vv-input-file",L,e(()=>({valid:!0===r.valid,invalid:!0===r.invalid,loading:r.loading&&!T.value,disabled:r.disabled,required:r.required,readonly:r.readonly,dragging:ae.value,"icon-before":!!q.value,"icon-after":!!G.value,"drop-area":le.value}))),{HintSlot:J,hasHintLabelOrSlot:W,hasInvalidLabelOrSlot:K,hintSlotScope:Y}=function(i,o){const n=e(()=>l(i)?i.value:i),r=e(()=>Se(n.value.invalidLabel)),u=e(()=>Se(n.value.validLabel)),s=e(()=>n.value.loadingLabel),v=e(()=>n.value.hintLabel),d=e(()=>Boolean(n.value.loading&&(o.loading||s.value))),c=e(()=>!d.value&&Boolean(n.value.invalid&&(o.invalid||r.value))),f=e(()=>!d.value&&!c.value&&Boolean(n.value.valid&&(o.valid||u.value))),p=e(()=>!d.value&&!c.value&&!f.value&&Boolean(o.hint||v.value)),b=e(()=>c.value||f.value||d.value||p.value),g=e(()=>({modelValue:n.value.modelValue,valid:n.value.valid,invalid:n.value.invalid,loading:n.value.loading})),y=t({name:"HintSlot",props:{tag:{type:String,default:"small"}},setup:()=>({isVisible:b,invalidLabel:r,validLabel:u,loadingLabel:s,hintLabel:v,hasInvalidLabelOrSlot:c,hasValidLabelOrSlot:f,hasLoadingLabelOrSlot:d,hasHintLabelOrSlot:p}),render(){if(this.isVisible){let e;return this.hasInvalidLabelOrSlot&&(e="alert"),this.hasValidLabelOrSlot&&(e="status"),this.hasLoadingLabelOrSlot?a(this.tag,{role:e},this.$slots.loading?.()??this.loadingLabel):this.hasInvalidLabelOrSlot?a(this.tag,{role:e},this.$slots.invalid?.()??this.$slots.invalid??this.invalidLabel):this.hasValidLabelOrSlot?a(this.tag,{role:e},this.$slots.valid?.()??this.validLabel):a(this.tag,{role:e},this.$slots.hint?.()??this.$slots.hint??this.hintLabel)}return null}});return{hasInvalidLabelOrSlot:c,hasHintLabelOrSlot:p,hasValidLabelOrSlot:f,hasLoadingLabelOrSlot:d,hintSlotScope:g,HintSlot:y}}(m,f),Z=N(r,"modelValue",v),Q=e({get:()=>Z.value&&(Array.isArray(Z.value)||Z.value?.name)?Array.isArray(Z.value)?Z.value:[Z.value]:[],set:e=>{te.value?Z.value=e:Z.value=e?.[0]}}),X=e(()=>r.disabled||r.readonly),ee=e(()=>"string"==typeof r.max?Number.parseInt(r.max):r.max),le=e(()=>r.dropArea&&!X.value),te=e(()=>!!r.multiple&&(!ee.value||ee.value-Q.value.length>1)),ae=u(!1),ie=u();function oe(){ae.value=!0}function ne(){ae.value=!1}function re(e){e.dataTransfer?.files&&(ae.value=!1,se(e.dataTransfer?.files))}function ue(){ie.value?.files&&(se(ie.value.files),ie.value.value="")}function se(e){const l=function(e,l){if(!l||""===l.trim()||"*"===l)return Array.from(e);const{mimeTypes:t,extensions:a,wildcards:i}=function(e){const l=[],t=[],a=[],i=e?.split(",").map(e=>e.trim().toLowerCase());return i?.length&&i.forEach(e=>{e.startsWith(".")?t.push(e):e.includes("/*")?a.push(e.replace("/*","")):l.push(e)}),{mimeTypes:l,extensions:t,wildcards:a}}(l);return Array.from(e).filter(e=>{const l=e.type.toLowerCase(),o=`.${e.name.split(".").pop()?.toLowerCase()}`,n=t.includes(l),r=i.some(e=>l.startsWith(`${e}/`)),u=a.some(e=>o===e.toLowerCase());return n||r||u})}(e,r.accept);if(!r.multiple)return Array.isArray(Z.value)?void(Z.value=l):void(Z.value=l[0]);let t=[];t=!Array.isArray(Z.value)&&Z.value?[Z.value]:Z.value&&Array.isArray(Z.value)?[...Z.value]:t;for(const a of l){if(ee.value&&t.length>=ee.value)break;t.push(a)}Z.value=t,de.value=t.length-1}function ve(){ie.value&&(X.value||ie.value.click())}const de=u(0),ce=["image/jpeg","image/png"],fe=e(()=>{if(0===Q.value.length)return;if(!Q.value[de.value])return;if(Q.value[de.value]instanceof File){const e=Q.value[de.value];if(!ce.includes(e.type))return;return URL.createObjectURL(e)}const e=Q.value[de.value];return e.thumbnailUrl?e.thumbnailUrl:ce.includes(e.type)?e.url:void 0});function pe(e,l){if(!e)return;if(0===e)return"0 Bytes";const t=Math.floor(Math.log(e)/Math.log(1024));return`${Number.parseFloat((e/1024**t).toFixed(2))} ${["Bytes","KB","MB","GB","TB","PB","EB","ZB","YB"][t]}`}s(fe,(e,l)=>{l&&URL.revokeObjectURL(l)}),O(()=>{fe.value&&URL.revokeObjectURL(fe.value)});const be=e(()=>0===Q.value.length||te.value?r.labelAdd:r.labelReplace),ge=e(()=>0===Q.value.length||te.value?r.iconAdd:r.iconReplace);function me({newIndex:e}){null!==e&&(de.value=e)}return(e,l)=>(c(),w("div",{class:_(p(z))},[e.label?(c(),w("label",{key:0,for:p(U)},h(e.label),9,Re)):S("v-if",!0),le.value?(c(),w("div",{key:1,class:"vv-input-file__drop-area",onDragenter:V(oe,["prevent","stop"]),onDragleave:V(ne,["prevent","stop"]),onDrop:V(re,["prevent","stop"]),onDragover:l[0]||(l[0]=V(()=>{},["prevent","stop"])),onClick:V(ve,["stop"])},[y(e.$slots,"drop-area",{},()=>[x("picture",Ce,[fe.value?(c(),w("img",{key:0,src:fe.value,alt:Q.value[de.value].name},null,8,Ne)):S("v-if",!0)]),p(A)?S("v-if",!0):(c(),d(je,{key:0,modifiers:"action",label:fe.value?void 0:be.value,title:fe.value?be.value:void 0,disabled:p(B),class:_({"vv-input-file__drop-area-action":fe.value}),icon:ge.value,onClick:V(ve,["stop"])},null,8,["label","title","disabled","class","icon"]))])],32)):S("v-if",!0),x("div",De,[p(q)?(c(),d(Oe,j(b({key:0},p(q))),null,16)):S("v-if",!0),x("input",{id:p(U),ref_key:"inputEl",ref:ie,type:"file",readonly:p(A),disabled:p(B),required:e.required,placeholder:e.placeholder,"aria-describedby":p(W)?M.value:void 0,"aria-invalid":e.invalid,"aria-errormessage":p(K)?M.value:void 0,multiple:te.value,accept:e.accept,capture:e.capture,name:e.name,onChange:ue},null,40,Fe),T.value?(c(),w("progress",{key:1,class:"vv-input-file__progress",value:e.progress,max:"100"},h(e.progress)+"% ",9,Pe)):S("v-if",!0),p(G)?(c(),d(Oe,j(b({key:2},p(G))),null,16)):S("v-if",!0)]),I(p(D),{modelValue:Q.value,"onUpdate:modelValue":l[1]||(l[1]=e=>Q.value=e),tag:"ul",class:"vv-input-file__list","item-key":"name",move:()=>e.sortable,onEnd:me},{item:g(({element:l,index:t})=>[x("li",{class:_(["vv-input-file__item",{active:t===de.value&&le.value&&Q.value.length>1,"cursor-move":e.sortable}]),onClick:V(e=>function(e){de.value=e}(t),["stop"])},[p(H)?(c(),w("button",{key:0,type:"button",class:"vv-input-file__item-action",title:e.labelDownload,onClick:V(e=>function(e){v("download",e);const l=e instanceof File?URL.createObjectURL(e):e.url;if(!l)return;const t=document.createElement("a");t.href=l,t.setAttribute("download",e.name),document.body.appendChild(t),t.click(),document.body.removeChild(t),URL.revokeObjectURL(t.href)}(l),["stop"])},[I(Oe,j(R(p(H))),null,16)],8,Ue)):S("v-if",!0),x("div",Me,h(l.name),1),x("small",Te,h(pe(l.size)),1),p(A)?S("v-if",!0):(c(),w("button",{key:1,type:"button",class:"vv-input-file__item-remove",title:e.labelRemove,disabled:p(B),onClick:V(e=>function(e){const l=Array.isArray(Z.value)?Z.value[e]:Z.value;if(!l)return;if(v("remove",l),!Array.isArray(Z.value))return void(Z.value=void 0);de.value===e&&(de.value=0);const t=[...Z.value];t.splice(e,1),Z.value=t}(t),["stop"])},null,8,qe))],10,Ee)]),_:1},8,["modelValue","move"]),I(p(J),{id:M.value,class:"vv-input-file__hint"},C({_:2},[e.$slots.hint?{name:"hint",fn:g(()=>[y(e.$slots,"hint",j(R(p(Y))))]),key:"0"}:void 0,e.$slots.loading?{name:"loading",fn:g(()=>[y(e.$slots,"loading",j(R(p(Y))))]),key:"1"}:void 0,e.$slots.valid?{name:"valid",fn:g(()=>[y(e.$slots,"valid",j(R(p(Y))))]),key:"2"}:void 0,e.$slots.invalid?{name:"invalid",fn:g(()=>[y(e.$slots,"invalid",j(R(p(Y))))]),key:"3"}:void 0]),1032,["id"])],2))}});export{Ge as default};