@volverjs/ui-vue 0.0.10-beta.22 → 0.0.10-beta.23
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/VvInputFile/VvInputFile.es.js +16 -1
- package/dist/components/VvInputFile/VvInputFile.umd.js +1 -1
- package/dist/components/VvInputFile/VvInputFile.vue.d.ts +43 -4
- package/dist/components/VvInputFile/index.d.ts +14 -2
- package/dist/components/index.es.js +16 -1
- package/dist/components/index.umd.js +1 -1
- package/dist/icons.es.js +3 -3
- package/dist/icons.umd.js +1 -1
- package/package.json +1 -1
- package/src/assets/icons/detailed.json +1 -1
- package/src/assets/icons/normal.json +1 -1
- package/src/assets/icons/simple.json +1 -1
- package/src/components/VvInputFile/VvInputFile.vue +1 -0
- package/src/components/VvInputFile/index.ts +20 -2
|
@@ -1202,6 +1202,20 @@ const VvInputFileProps = {
|
|
|
1202
1202
|
* @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#multiple
|
|
1203
1203
|
*/
|
|
1204
1204
|
multiple: { type: Boolean, default: false },
|
|
1205
|
+
/**
|
|
1206
|
+
* Front or rear camera
|
|
1207
|
+
* @see https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/capture
|
|
1208
|
+
*/
|
|
1209
|
+
capture: {
|
|
1210
|
+
type: String,
|
|
1211
|
+
default: void 0,
|
|
1212
|
+
validation: (value) => {
|
|
1213
|
+
if (value === void 0) {
|
|
1214
|
+
return true;
|
|
1215
|
+
}
|
|
1216
|
+
return ["user", "environment"].includes(value);
|
|
1217
|
+
}
|
|
1218
|
+
},
|
|
1205
1219
|
/**
|
|
1206
1220
|
* Max number of files
|
|
1207
1221
|
*/
|
|
@@ -1320,7 +1334,7 @@ const _hoisted_1 = ["for"];
|
|
|
1320
1334
|
const _hoisted_2 = { class: "vv-input-file__preview" };
|
|
1321
1335
|
const _hoisted_3 = ["src", "alt"];
|
|
1322
1336
|
const _hoisted_4 = { class: "vv-input-file__wrapper" };
|
|
1323
|
-
const _hoisted_5 = ["id", "readonly", "placeholder", "aria-describedby", "aria-invalid", "aria-errormessage", "multiple", "accept", "name"];
|
|
1337
|
+
const _hoisted_5 = ["id", "readonly", "placeholder", "aria-describedby", "aria-invalid", "aria-errormessage", "multiple", "accept", "capture", "name"];
|
|
1324
1338
|
const _hoisted_6 = ["value"];
|
|
1325
1339
|
const _hoisted_7 = { class: "vv-input-file__list" };
|
|
1326
1340
|
const _hoisted_8 = ["onClick"];
|
|
@@ -1603,6 +1617,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
1603
1617
|
"aria-errormessage": unref(hasInvalidLabelOrSlot) ? hasHintId.value : void 0,
|
|
1604
1618
|
multiple: isMultiple.value,
|
|
1605
1619
|
accept: _ctx.accept,
|
|
1620
|
+
capture: _ctx.capture,
|
|
1606
1621
|
name: _ctx.name,
|
|
1607
1622
|
onChange
|
|
1608
1623
|
}, null, 40, _hoisted_5),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
!function(e,l){"object"==typeof exports&&"undefined"!=typeof module?module.exports=l(require("vue"),require("@vueuse/core"),require("@iconify/vue"),require("uid")):"function"==typeof define&&define.amd?define(["vue","@vueuse/core","@iconify/vue","uid"],l):(e="undefined"!=typeof globalThis?globalThis:e||self).VvInputFile=l(e.vue,e.core,e.vue$1,e.uid)}(this,(function(e,l,t,o){"use strict";const a="add",n="edit",r="download",i={prefix:"normal"};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||{}),s=(e=>(e.button="button",e.submit="submit",e.reset="reset",e))(s||{}),v=(e=>(e.nuxtLink="nuxt-link",e.routerLink="router-link",e.a="a",e.button="button",e))(v||{}),c=(e=>(e._blank="_blank",e._self="_self",e._parent="_parent",e._top="_top",e))(c||{});const f=Symbol.for("volver"),p=Symbol.for("buttonGroup"),m=Symbol.for("dropdownTrigger"),g=Symbol.for("dropdownAction");function y(){return e.inject(f)}function b(l,t,o){return e.computed((()=>{const a={[l]:!0},n="string"==typeof(null==t?void 0:t.value)?t.value.split(" "):null==t?void 0:t.value;return n&&Array.isArray(n)&&n.forEach((e=>{e&&(a[`${l}--${e}`]=!0)})),o&&Object.keys(o.value).forEach((t=>{a[`${l}--${t}`]=e.unref(o.value[t])})),a}))}const h=e.defineComponent({name:"VvIcon",props:e.mergeDefaults({name:{},color:{},width:{},height:{},provider:{},prefix:{},src:{},horizontalFlip:{type:Boolean},verticalFlip:{type:Boolean},flip:{},mode:{},inline:{type:Boolean},rotate:{},onLoad:{type:Function},svg:{},modifiers:{}},i),setup(l){const o=l,a=e.computed((()=>"string"==typeof o.rotate?parseFloat(o.rotate):o.rotate)),n=e.ref(!0),r=y(),{modifiers:i}=e.toRefs(o),u=b("vv-icon",i),d=e.computed((()=>o.provider||(null==r?void 0:r.iconsProvider))),s=e.computed((()=>{const e=o.name??"",l=`@${d.value}:${o.prefix}:${e}`;if(t.iconExists(l))return l;const a=null==r?void 0:r.iconsCollections.find((l=>{const o=`@${d.value}:${l.prefix}:${e}`;return t.iconExists(o)}));return a?`@${d.value}:${a.prefix}:${e}`:e}));function v(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=(null==l?void 0:l.innerHTML.trim())||"";l&&a&&t.addIcon(`@${d.value}:${o.prefix}:${o.name}`,{body:a,height:l.viewBox.baseVal.height,width:l.viewBox.baseVal.width})}return r&&o.src&&!t.iconExists(`@${d.value}:${o.prefix}:${o.name}`)&&(n.value=!1,r.fetchIcon(o.src).then((e=>{e&&(v(e),n.value=!0)})).catch((e=>{throw new Error(`Error during fetch icon: ${null==e?void 0:e.message}`)}))),o.svg&&v(o.svg),(l,o)=>e.unref(n)?(e.openBlock(),e.createBlock(e.unref(t.Icon),e.mergeProps({key:0,class:e.unref(u)},{inline:l.inline,width:l.width,height:l.height,horizontalFlip:l.horizontalFlip,verticalFlip:l.verticalFlip,flip:l.flip,rotate:e.unref(a),color:l.color,onLoad:l.onLoad,icon:e.unref(s)}),null,16,["class"])):e.createCommentVNode("v-if",!0)}}),k={to:{type:[String,Object]},href:String,target:{type:String,default:void 0,validator:e=>Object.values(c).includes(e)},rel:{type:String,default:"noopener noreferrer"}},S={valid:{type:Boolean,default:!1},validLabel:{type:[String,Array],default:void 0}},B={invalid:{type:Boolean,default:!1},invalidLabel:{type:[String,Array],default:void 0}},L={loading:{type:Boolean,default:!1},loadingLabel:{type:String,default:"Loading..."}},V={disabled:{type:Boolean,default:!1}},w={active:{type:Boolean,default:!1}},A={current:{type:Boolean,default:!1}},$={pressed:{type:Boolean,default:!1}},O={label:{type:[String,Number],default:void 0}},_={readonly:{type:Boolean,default:!1}},C={modifiers:{type:[String,Array],default:void 0}},x={hintLabel:{type:String,default:""}},j={icon:{type:[String,Object],default:void 0},iconPosition:{type:String,default:d.before,validation:e=>Object.values(d).includes(e)}},N={unselectable:{type:Boolean,default:!0}},R={id:[String,Number]};u.bottom,Boolean,Boolean,Boolean,Boolean,Boolean,Boolean,Boolean,Boolean;const P={...R,name:{type:String,required:!0}},E={...V,...O,...$,...w,...A,...k,type:{type:String,default:s.button,validator:e=>Object.values(s).includes(e)},ariaLabel:{type:String,default:void 0},defaultTag:{type:String,default:v.button}},I=E;const D=e.defineComponent({name:"VvAction",props:I,emits:["click","mouseover","mouseleave"],setup(l,{expose:t,emit:o}){const a=l,n=o,r=y(),i=e.ref(null);t({$el:i});const{reference:u,bus:d,aria:s,expanded:c}=e.inject(m,{});e.watch((()=>i.value),(e=>{u&&(u.value=e)}));const f=e.computed((()=>a.pressed||(null==c?void 0:c.value))),{role:p}=e.inject(g,{}),b=e.computed((()=>{switch(!0){case a.disabled:return v.button;case void 0!==a.to:return(null==r?void 0:r.nuxt)?v.nuxtLink:v.routerLink;case void 0!==a.href:return v.a;default:return a.defaultTag}})),h=e.computed((()=>{const e={...null==s?void 0:s.value,ariaPressed:!!f.value||void 0,ariaLabel:a.ariaLabel,role:null==p?void 0:p.value};switch(b.value){case v.a:return{...e,href:a.href,target:a.target,rel:a.rel};case v.routerLink:case v.nuxtLink:return{...e,to:a.to,target:a.target};case v.button:return{...e,type:a.type,disabled:a.disabled};default:return e}})),k=e=>{a.disabled?e.preventDefault():(null==d||d.emit("click",e),n("click",e))},S=e=>{null==d||d.emit("mouseover",e),n("mouseover",e)},B=e=>{null==d||d.emit("mouseleave",e),n("mouseleave",e)};return(l,t)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(e.unref(b)),e.mergeProps(e.unref(h),{ref_key:"element",ref:i,class:{active:l.active,pressed:e.unref(f),disabled:l.disabled,current:l.current},onClickPassive:k,onMouseoverPassive:S,onMouseleavePassive:B}),{default:e.withCtx((()=>[e.renderSlot(l.$slots,"default",{},(()=>[e.createTextVNode(e.toDisplayString(l.label),1)]))])),_:3},16,["class"]))}});function M(e,l,t){return t?z(e,t)===z(l,t):F(e,l)}function F(e,l){if(e===l)return!0;if(e&&l&&"object"==typeof e&&"object"==typeof l){const t=Array.isArray(e),o=Array.isArray(l);let a,n,r;if(t&&o){if(n=e.length,n!=l.length)return!1;for(a=n;0!=a--;)if(!F(e[a],l[a]))return!1;return!0}if(t!=o)return!1;const i=e instanceof Date,u=l instanceof Date;if(i!=u)return!1;if(i&&u)return e.getTime()==l.getTime();const d=e instanceof RegExp,s=l instanceof RegExp;if(d!=s)return!1;if(d&&s)return e.toString()==l.toString();const v=Object.keys(e);if(n=v.length,n!==Object.keys(l).length)return!1;for(a=n;0!=a--;)if(!Object.prototype.hasOwnProperty.call(l,v[a]))return!1;for(a=n;0!=a--;)if(r=v[a],!F(e[r],l[r]))return!1;return!0}return e!=e&&l!=l}function z(e,l){if(e&&Object.keys(e).length&&l){if(-1===l.indexOf("."))return e[l];{const t=l.split(".");let o=e;for(let l=0,a=t.length;l<a;++l){if(null==e)return null;o=o[t[l]]}return o}}return null}function T(e,l){if(null!=e&&l&&l.length)for(const t of l)if(M(e,t))return!0;return!1}function U(l){const t=e.inject(l,void 0),o=e.computed((()=>{return l=t,!(null==(o=e.unref(l))||""===o||Array.isArray(o)&&0===o.length||!(o instanceof Date)&&"object"==typeof o&&0===Object.keys(o).length);var l,o}));return{group:t,isInGroup:o,getGroupOrLocalRef:function(l,o,a){if(null==t?void 0:t.value){const o=e.unref(t.value)[l];return e.computed({get:()=>null==o?void 0:o.value,set(e){o.value=e}})}const n=e.toRef(o,l);return e.computed({get:()=>n.value,set(e){a&&a(`update:${l}`,e)}})}}}const q={...E,...R,...C,...N,...L,...j,iconPosition:{type:String,default:u.left,validator:e=>Object.values(u).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}};const H=l=>e.computed((()=>String((null==l?void 0:l.value)||o.uid())));function G(l,t){const o=e.computed((()=>"string"==typeof(null==l?void 0:l.value)?{name:null==l?void 0:l.value}:null==l?void 0:l.value)),a=e.computed((()=>(null==t?void 0:t.value)===d.before?o.value:void 0)),n=e.computed((()=>(null==t?void 0:t.value)===d.after?o.value:void 0)),r=e.computed((()=>(null==t?void 0:t.value)===u.left?o.value:void 0)),i=e.computed((()=>(null==t?void 0:t.value)===u.right?o.value:void 0)),s=e.computed((()=>(null==t?void 0:t.value)===u.top?o.value:void 0)),v=e.computed((()=>(null==t?void 0:t.value)===u.bottom?o.value:void 0));return{hasIcon:o,hasIconLeft:r,hasIconRight:i,hasIconTop:s,hasIconBottom:v,hasIconBefore:a,hasIconAfter:n}}const J={key:1,class:"vv-button__label"},K={key:1,class:"vv-button__label"},Q=e.defineComponent({name:"VvButton",props:q,emits:["update:modelValue"],setup(l,{expose:t,emit:o}){const a=l,n=e.useAttrs(),r=e.useSlots(),i=o,{id:d,modifiers:s,iconPosition:v,icon:c,label:f,modelValue:m,disabled:g,toggle:y,unselectable:k}=function(l,t){const{group:o,isInGroup:a,getGroupOrLocalRef:n}=U(p),{id:r,iconPosition:i,icon:u,label:d,pressed:s}=e.toRefs(l),v=n("modelValue",l,t),c=n("toggle",l),f=n("unselectable",l),m=e.computed((()=>(null==o?void 0:o.value.multiple.value)??!1)),g=e.computed((()=>{let e=l.modifiers,t=null==o?void 0:o.value.modifiers.value;const a=new Set;return e&&(Array.isArray(e)||(e=e.split(" ")),e.forEach((e=>a.add(e)))),t&&(Array.isArray(t)||(t=t.split(" ")),t.forEach((e=>a.add(e)))),Array.from(a)})),y=e.computed((()=>{var e;return Boolean(l.disabled||(null==(e=null==o?void 0:o.value)?void 0:e.disabled.value))}));return{group:o,isInGroup:a,modelValue:v,toggle:c,unselectable:f,multiple:m,modifiers:g,disabled:y,id:r,pressed:s,iconPosition:i,icon:u,label:d}}(a,i),S=H(d),B=e.computed((()=>(null==n?void 0:n.name)||S.value)),L=e.ref(null);t({$el:e.computed((()=>{var e;return null==(e=L.value)?void 0:e.$el}))});const V=e.computed((()=>y.value?Array.isArray(m.value)?T(B.value,m.value):M(B.value,m.value):a.pressed)),w=b("vv-button",s,e.computed((()=>({reverse:[u.right,u.bottom].includes(v.value),column:[u.top,u.bottom].includes(v.value),"icon-only":Boolean((null==c?void 0:c.value)&&!(null==f?void 0:f.value)&&!r.default)})))),{hasIcon:A}=G(c),$=e.computed((()=>void 0!==a.value?a.value:B.value)),O=()=>{if(y.value){if(Array.isArray(m.value))return T($.value,m.value)?void(k.value&&(m.value=m.value.filter((e=>e!==$.value)))):void m.value.push($.value);if($.value===m.value&&k.value)return void(m.value=a.uncheckedValue);m.value=$.value}};return(l,t)=>(e.openBlock(),e.createBlock(D,e.mergeProps({disabled:e.unref(g),pressed:e.unref(V),active:l.active,type:l.type,to:l.to,href:l.href,target:l.target,rel:l.rel,ariaLabel:l.ariaLabel},{id:e.unref(S),ref_key:"element",ref:L,class:e.unref(w),onClick:O}),{default:e.withCtx((()=>[e.renderSlot(l.$slots,"default",{},(()=>[l.loading?e.renderSlot(l.$slots,"loading",{key:0},(()=>[l.loadingIcon?(e.openBlock(),e.createBlock(h,{key:0,class:"vv-button__loading-icon",name:l.loadingIcon},null,8,["name"])):e.createCommentVNode("v-if",!0),l.loadingLabel?(e.openBlock(),e.createElementBlock("span",J,e.toDisplayString(l.loadingLabel),1)):e.createCommentVNode("v-if",!0)])):(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[e.renderSlot(l.$slots,"before"),e.unref(A)?(e.openBlock(),e.createBlock(h,e.mergeProps({key:0},e.unref(A),{class:"vv-button__icon"}),null,16)):e.createCommentVNode("v-if",!0),e.unref(f)?(e.openBlock(),e.createElementBlock("span",K,[e.renderSlot(l.$slots,"label",{},(()=>[e.createTextVNode(e.toDisplayString(e.unref(f)),1)]))])):e.createCommentVNode("v-if",!0),e.renderSlot(l.$slots,"after")],64))]))])),_:3},16,["id","class"]))}});function W(e){return Array.isArray(e)?e.filter((e=>{return"string"==typeof(l=e)||l instanceof String;var l})).join(" "):e}const X={...P,...C,...S,...B,...x,...O,...L,..._,...j,modelValue:{type:Object,required:!0},progress:{type:[Number,String],default:void 0},placeholder:{type:String,default:void 0},accept:{type:String,default:"*"},multiple:{type:Boolean,default:!1},max:{type:[Number,String],default:void 0},dropArea:{type:Boolean,default:!1},labelAdd:{type:String,default:"Add file"},iconAdd:{type:[String,Object],default:a},labelReplace:{type:String,default:"Replace file"},iconReplace:{type:[String,Object],default:n},labelDownload:{type:String,default:"Downlaod file"},iconDownload:{type:[String,Object],default:r},labelRemove:{type:String,default:"Remove file"}};const Y=["for"],Z={class:"vv-input-file__preview"},ee=["src","alt"],le={class:"vv-input-file__wrapper"},te=["id","readonly","placeholder","aria-describedby","aria-invalid","aria-errormessage","multiple","accept","name"],oe=["value"],ae={class:"vv-input-file__list"},ne=["onClick"],re=["title","onClick"],ie={class:"vv-input-file__item-name"},ue={class:"vv-input-file__item-info"},de=["title","onClick"];return e.defineComponent({name:"VvInputFile",props:X,emits:["update:modelValue"],setup(t,{emit:o}){const a=t,n=o,r=e.useSlots(),i=function(l,t,o){const a=y(),n=e.computed((()=>{var e;if(a&&(null==(e=a.defaults.value)?void 0:e[l]))return a.defaults.value[l]}));return e.computed((()=>{if(void 0===n.value)return o;const e=n.value,l=t,a=o;return Object.keys(l).reduce(((t,o)=>{const n=a[o];if(t[o]=n,o in e){if(Array.isArray(l[o])){const a=l[o];a.length&&a[0]===n&&(t[o]=e[o])}if("function"==typeof l[o]&&(0,l[o])()===n&&(t[o]=e[o]),"object"==typeof l[o]){let a=l[o].default;"function"==typeof a&&(a=a()),"object"==typeof a?JSON.stringify(a)===JSON.stringify(n)&&(t[o]=e[o]):a===n&&(t[o]=e[o])}}return t}),{})}))}("VvInputFile",X,a),{modifiers:u,id:d,readonly:s,icon:v,iconPosition:c,iconDownload:f}=e.toRefs(a),p=H(d),m=e.computed((()=>`${p.value}-hint`)),g=e.computed((()=>{if(!a.progress)return!1;const e="string"==typeof a.progress?parseInt(a.progress):a.progress;return e>0&&e<100})),{hasIconBefore:k,hasIconAfter:S}=G(v,c),{hasIcon:B}=G(f),L=b("vv-input-file",u,e.computed((()=>({dragging:N.value,loading:a.loading&&!g.value,valid:!0===a.valid,invalid:!0===a.invalid,"icon-before":!!k.value,"icon-after":!!S.value,"drop-area":x.value})))),{HintSlot:V,hasHintLabelOrSlot:w,hasInvalidLabelOrSlot:A,hintSlotScope:$}=function(l,t){const o=e.computed((()=>e.isRef(l)?l.value:l)),a=e.computed((()=>W(o.value.invalidLabel))),n=e.computed((()=>W(o.value.validLabel))),r=e.computed((()=>o.value.loadingLabel)),i=e.computed((()=>o.value.hintLabel)),u=e.computed((()=>Boolean(o.value.loading&&(t.loading||r.value)))),d=e.computed((()=>!u.value&&Boolean(o.value.invalid&&(t.invalid||a.value)))),s=e.computed((()=>!u.value&&!d.value&&Boolean(o.value.valid&&(t.valid||n.value)))),v=e.computed((()=>!u.value&&!d.value&&!s.value&&Boolean(t.hint||i.value))),c=e.computed((()=>d.value||s.value||u.value||v.value)),f=e.computed((()=>({modelValue:o.value.modelValue,valid:o.value.valid,invalid:o.value.invalid,loading:o.value.loading}))),p=e.defineComponent({name:"HintSlot",props:{tag:{type:String,default:"small"}},setup:()=>({isVisible:c,invalidLabel:a,validLabel:n,loadingLabel:r,hintLabel:i,hasInvalidLabelOrSlot:d,hasValidLabelOrSlot:s,hasLoadingLabelOrSlot:u,hasHintLabelOrSlot:v}),render(){var l,t,o,a,n,r,i,u;if(this.isVisible){let d;return this.hasInvalidLabelOrSlot&&(d="alert"),this.hasValidLabelOrSlot&&(d="status"),this.hasLoadingLabelOrSlot?e.h(this.tag,{role:d},(null==(t=(l=this.$slots).loading)?void 0:t.call(l))??this.loadingLabel):this.hasInvalidLabelOrSlot?e.h(this.tag,{role:d},(null==(a=(o=this.$slots).invalid)?void 0:a.call(o))??this.$slots.invalid??this.invalidLabel):this.hasValidLabelOrSlot?e.h(this.tag,{role:d},(null==(r=(n=this.$slots).valid)?void 0:r.call(n))??this.validLabel):e.h(this.tag,{role:d},(null==(u=(i=this.$slots).hint)?void 0:u.call(i))??this.$slots.hint??this.hintLabel)}return null}});return{hasInvalidLabelOrSlot:d,hasHintLabelOrSlot:v,hasValidLabelOrSlot:s,hasLoadingLabelOrSlot:u,hintSlotScope:f,HintSlot:p}}(i,r),O=l.useVModel(a,"modelValue",n),_=e.computed((()=>{var e;return O.value&&(Array.isArray(O.value)||(null==(e=O.value)?void 0:e.name))?Array.isArray(O.value)?O.value:[O.value]:[]})),C=e.computed((()=>"string"==typeof a.max?parseInt(a.max):a.max)),x=e.computed((()=>a.dropArea&&!s.value)),j=e.computed((()=>!!a.multiple&&(!C.value||C.value-_.value.length>1))),N=e.ref(!1),R=e.ref(),P=()=>{N.value=!0},E=()=>{N.value=!1},I=e=>{var l,t;(null==(l=e.dataTransfer)?void 0:l.files)&&(N.value=!1,M(null==(t=e.dataTransfer)?void 0:t.files))},D=()=>{var e;(null==(e=R.value)?void 0:e.files)&&(M(R.value.files),R.value.value="")},M=e=>{if(!a.multiple)return Array.isArray(O.value)?void(O.value=[...e]):void(O.value=e[0]);let l=[];l=!Array.isArray(O.value)&&O.value?[O.value]:O.value&&Array.isArray(O.value)?[...O.value]:l;for(const t of e){if(C.value&&l.length>=C.value)break;l.push(t)}O.value=l,z.value=l.length-1},F=()=>{R.value&&(s.value||R.value.click())},z=e.ref(0),T=["image/jpeg","image/png"],U=e.computed((()=>{if(0===_.value.length)return;if(!_.value[z.value])return;if(_.value[z.value]instanceof File){const e=_.value[z.value];if(!T.includes(e.type))return;return URL.createObjectURL(e)}const e=_.value[z.value];return e.thumbnailUrl?e.thumbnailUrl:T.includes(e.type)?e.url:void 0}));e.watch(U,((e,l)=>{l&&URL.revokeObjectURL(l)})),e.onBeforeUnmount((()=>{U.value&&URL.revokeObjectURL(U.value)}));const q=e=>{if(e)return Math.floor(e/1024)},J=e.computed((()=>0===_.value.length||j.value?a.labelAdd:a.labelReplace)),K=e.computed((()=>0===_.value.length||j.value?a.iconAdd:a.iconReplace));return(l,t)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(e.unref(L))},[l.label?(e.openBlock(),e.createElementBlock("label",{key:0,for:e.unref(p)},e.toDisplayString(l.label),9,Y)):e.createCommentVNode("v-if",!0),x.value?(e.openBlock(),e.createElementBlock("div",{key:1,class:"vv-input-file__drop-area",onDragenter:e.withModifiers(P,["prevent","stop"]),onDragleave:e.withModifiers(E,["prevent","stop"]),onDrop:e.withModifiers(I,["prevent","stop"]),onDragover:t[0]||(t[0]=e.withModifiers((()=>{}),["prevent","stop"])),onClick:e.withModifiers(F,["stop"])},[e.renderSlot(l.$slots,"drop-area",{},(()=>[e.createElementVNode("picture",Z,[U.value?(e.openBlock(),e.createElementBlock("img",{key:0,src:U.value,alt:_.value[z.value].name},null,8,ee)):e.createCommentVNode("v-if",!0)]),e.unref(s)?e.createCommentVNode("v-if",!0):(e.openBlock(),e.createBlock(Q,{key:0,modifiers:"action",label:U.value?void 0:J.value,title:U.value?J.value:void 0,class:e.normalizeClass({"vv-input-file__drop-area-action":U.value}),icon:K.value,onClick:e.withModifiers(F,["stop"])},null,8,["label","title","class","icon"]))]))],32)):e.createCommentVNode("v-if",!0),e.createElementVNode("div",le,[e.unref(k)?(e.openBlock(),e.createBlock(h,e.normalizeProps(e.mergeProps({key:0},e.unref(k))),null,16)):e.createCommentVNode("v-if",!0),e.createElementVNode("input",{id:e.unref(p),ref_key:"inputEl",ref:R,type:"file",readonly:e.unref(s),placeholder:l.placeholder,"aria-describedby":e.unref(w)?m.value:void 0,"aria-invalid":l.invalid,"aria-errormessage":e.unref(A)?m.value:void 0,multiple:j.value,accept:l.accept,name:l.name,onChange:D},null,40,te),g.value?(e.openBlock(),e.createElementBlock("progress",{key:1,class:"vv-input-file__progress",value:l.progress,max:"100"},e.toDisplayString(l.progress)+"% ",9,oe)):e.createCommentVNode("v-if",!0),e.unref(S)?(e.openBlock(),e.createBlock(h,e.normalizeProps(e.mergeProps({key:2},e.unref(S))),null,16)):e.createCommentVNode("v-if",!0)]),e.createElementVNode("ul",ae,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(_.value,((t,o)=>(e.openBlock(),e.createElementBlock("li",{key:o,class:e.normalizeClass(["vv-input-file__item",{active:o===z.value&&x.value&&_.value.length>1}]),onClick:e.withModifiers((e=>(e=>{z.value=e})(o)),["stop"])},[e.unref(B)?(e.openBlock(),e.createElementBlock("button",{key:0,type:"button",class:"vv-input-file__item-action",title:l.labelDownload,onClick:e.withModifiers((e=>(e=>{const l=document.createElement("a");e instanceof File?l.href=URL.createObjectURL(e):e.url&&(l.href=e.url),l.setAttribute("download",e.name),document.body.appendChild(l),l.click(),document.body.removeChild(l),URL.revokeObjectURL(l.href)})(t)),["stop"])},[e.createVNode(h,e.normalizeProps(e.guardReactiveProps(e.unref(B))),null,16)],8,re)):e.createCommentVNode("v-if",!0),e.createElementVNode("div",ie,e.toDisplayString(t.name),1),e.createElementVNode("small",ue,e.toDisplayString(q(t.size))+" KB ",1),e.unref(s)?e.createCommentVNode("v-if",!0):(e.openBlock(),e.createElementBlock("button",{key:1,type:"button",class:"vv-input-file__item-remove",title:l.labelRemove,onClick:e.withModifiers((e=>(e=>{if(!Array.isArray(O.value))return void(O.value=void 0);z.value===e&&(z.value=0);const l=[...O.value];l.splice(e,1),O.value=l})(o)),["stop"])},null,8,de))],10,ne)))),128))]),e.createVNode(e.unref(V),{id:m.value,class:"vv-input-file__hint"},e.createSlots({_:2},[l.$slots.hint?{name:"hint",fn:e.withCtx((()=>[e.renderSlot(l.$slots,"hint",e.normalizeProps(e.guardReactiveProps(e.unref($))))])),key:"0"}:void 0,l.$slots.loading?{name:"loading",fn:e.withCtx((()=>[e.renderSlot(l.$slots,"loading",e.normalizeProps(e.guardReactiveProps(e.unref($))))])),key:"1"}:void 0,l.$slots.valid?{name:"valid",fn:e.withCtx((()=>[e.renderSlot(l.$slots,"valid",e.normalizeProps(e.guardReactiveProps(e.unref($))))])),key:"2"}:void 0,l.$slots.invalid?{name:"invalid",fn:e.withCtx((()=>[e.renderSlot(l.$slots,"invalid",e.normalizeProps(e.guardReactiveProps(e.unref($))))])),key:"3"}:void 0]),1032,["id"])],2))}})}));
|
|
1
|
+
!function(e,l){"object"==typeof exports&&"undefined"!=typeof module?module.exports=l(require("vue"),require("@vueuse/core"),require("@iconify/vue"),require("uid")):"function"==typeof define&&define.amd?define(["vue","@vueuse/core","@iconify/vue","uid"],l):(e="undefined"!=typeof globalThis?globalThis:e||self).VvInputFile=l(e.vue,e.core,e.vue$1,e.uid)}(this,(function(e,l,t,o){"use strict";const a="add",n="edit",r="download",i={prefix:"normal"};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||{}),s=(e=>(e.button="button",e.submit="submit",e.reset="reset",e))(s||{}),c=(e=>(e.nuxtLink="nuxt-link",e.routerLink="router-link",e.a="a",e.button="button",e))(c||{}),v=(e=>(e._blank="_blank",e._self="_self",e._parent="_parent",e._top="_top",e))(v||{});const p=Symbol.for("volver"),f=Symbol.for("buttonGroup"),m=Symbol.for("dropdownTrigger"),g=Symbol.for("dropdownAction");function y(){return e.inject(p)}function b(l,t,o){return e.computed((()=>{const a={[l]:!0},n="string"==typeof(null==t?void 0:t.value)?t.value.split(" "):null==t?void 0:t.value;return n&&Array.isArray(n)&&n.forEach((e=>{e&&(a[`${l}--${e}`]=!0)})),o&&Object.keys(o.value).forEach((t=>{a[`${l}--${t}`]=e.unref(o.value[t])})),a}))}const h=e.defineComponent({name:"VvIcon",props:e.mergeDefaults({name:{},color:{},width:{},height:{},provider:{},prefix:{},src:{},horizontalFlip:{type:Boolean},verticalFlip:{type:Boolean},flip:{},mode:{},inline:{type:Boolean},rotate:{},onLoad:{type:Function},svg:{},modifiers:{}},i),setup(l){const o=l,a=e.computed((()=>"string"==typeof o.rotate?parseFloat(o.rotate):o.rotate)),n=e.ref(!0),r=y(),{modifiers:i}=e.toRefs(o),u=b("vv-icon",i),d=e.computed((()=>o.provider||(null==r?void 0:r.iconsProvider))),s=e.computed((()=>{const e=o.name??"",l=`@${d.value}:${o.prefix}:${e}`;if(t.iconExists(l))return l;const a=null==r?void 0:r.iconsCollections.find((l=>{const o=`@${d.value}:${l.prefix}:${e}`;return t.iconExists(o)}));return a?`@${d.value}:${a.prefix}:${e}`:e}));function c(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=(null==l?void 0:l.innerHTML.trim())||"";l&&a&&t.addIcon(`@${d.value}:${o.prefix}:${o.name}`,{body:a,height:l.viewBox.baseVal.height,width:l.viewBox.baseVal.width})}return r&&o.src&&!t.iconExists(`@${d.value}:${o.prefix}:${o.name}`)&&(n.value=!1,r.fetchIcon(o.src).then((e=>{e&&(c(e),n.value=!0)})).catch((e=>{throw new Error(`Error during fetch icon: ${null==e?void 0:e.message}`)}))),o.svg&&c(o.svg),(l,o)=>e.unref(n)?(e.openBlock(),e.createBlock(e.unref(t.Icon),e.mergeProps({key:0,class:e.unref(u)},{inline:l.inline,width:l.width,height:l.height,horizontalFlip:l.horizontalFlip,verticalFlip:l.verticalFlip,flip:l.flip,rotate:e.unref(a),color:l.color,onLoad:l.onLoad,icon:e.unref(s)}),null,16,["class"])):e.createCommentVNode("v-if",!0)}}),k={to:{type:[String,Object]},href:String,target:{type:String,default:void 0,validator:e=>Object.values(v).includes(e)},rel:{type:String,default:"noopener noreferrer"}},S={valid:{type:Boolean,default:!1},validLabel:{type:[String,Array],default:void 0}},B={invalid:{type:Boolean,default:!1},invalidLabel:{type:[String,Array],default:void 0}},L={loading:{type:Boolean,default:!1},loadingLabel:{type:String,default:"Loading..."}},V={disabled:{type:Boolean,default:!1}},w={active:{type:Boolean,default:!1}},A={current:{type:Boolean,default:!1}},$={pressed:{type:Boolean,default:!1}},O={label:{type:[String,Number],default:void 0}},_={readonly:{type:Boolean,default:!1}},C={modifiers:{type:[String,Array],default:void 0}},x={hintLabel:{type:String,default:""}},j={icon:{type:[String,Object],default:void 0},iconPosition:{type:String,default:d.before,validation:e=>Object.values(d).includes(e)}},N={unselectable:{type:Boolean,default:!0}},R={id:[String,Number]};u.bottom,Boolean,Boolean,Boolean,Boolean,Boolean,Boolean,Boolean,Boolean;const P={...R,name:{type:String,required:!0}},E={...V,...O,...$,...w,...A,...k,type:{type:String,default:s.button,validator:e=>Object.values(s).includes(e)},ariaLabel:{type:String,default:void 0},defaultTag:{type:String,default:c.button}},I=E;const D=e.defineComponent({name:"VvAction",props:I,emits:["click","mouseover","mouseleave"],setup(l,{expose:t,emit:o}){const a=l,n=o,r=y(),i=e.ref(null);t({$el:i});const{reference:u,bus:d,aria:s,expanded:v}=e.inject(m,{});e.watch((()=>i.value),(e=>{u&&(u.value=e)}));const p=e.computed((()=>a.pressed||(null==v?void 0:v.value))),{role:f}=e.inject(g,{}),b=e.computed((()=>{switch(!0){case a.disabled:return c.button;case void 0!==a.to:return(null==r?void 0:r.nuxt)?c.nuxtLink:c.routerLink;case void 0!==a.href:return c.a;default:return a.defaultTag}})),h=e.computed((()=>{const e={...null==s?void 0:s.value,ariaPressed:!!p.value||void 0,ariaLabel:a.ariaLabel,role:null==f?void 0:f.value};switch(b.value){case c.a:return{...e,href:a.href,target:a.target,rel:a.rel};case c.routerLink:case c.nuxtLink:return{...e,to:a.to,target:a.target};case c.button:return{...e,type:a.type,disabled:a.disabled};default:return e}})),k=e=>{a.disabled?e.preventDefault():(null==d||d.emit("click",e),n("click",e))},S=e=>{null==d||d.emit("mouseover",e),n("mouseover",e)},B=e=>{null==d||d.emit("mouseleave",e),n("mouseleave",e)};return(l,t)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(e.unref(b)),e.mergeProps(e.unref(h),{ref_key:"element",ref:i,class:{active:l.active,pressed:e.unref(p),disabled:l.disabled,current:l.current},onClickPassive:k,onMouseoverPassive:S,onMouseleavePassive:B}),{default:e.withCtx((()=>[e.renderSlot(l.$slots,"default",{},(()=>[e.createTextVNode(e.toDisplayString(l.label),1)]))])),_:3},16,["class"]))}});function M(e,l,t){return t?z(e,t)===z(l,t):F(e,l)}function F(e,l){if(e===l)return!0;if(e&&l&&"object"==typeof e&&"object"==typeof l){const t=Array.isArray(e),o=Array.isArray(l);let a,n,r;if(t&&o){if(n=e.length,n!=l.length)return!1;for(a=n;0!=a--;)if(!F(e[a],l[a]))return!1;return!0}if(t!=o)return!1;const i=e instanceof Date,u=l instanceof Date;if(i!=u)return!1;if(i&&u)return e.getTime()==l.getTime();const d=e instanceof RegExp,s=l instanceof RegExp;if(d!=s)return!1;if(d&&s)return e.toString()==l.toString();const c=Object.keys(e);if(n=c.length,n!==Object.keys(l).length)return!1;for(a=n;0!=a--;)if(!Object.prototype.hasOwnProperty.call(l,c[a]))return!1;for(a=n;0!=a--;)if(r=c[a],!F(e[r],l[r]))return!1;return!0}return e!=e&&l!=l}function z(e,l){if(e&&Object.keys(e).length&&l){if(-1===l.indexOf("."))return e[l];{const t=l.split(".");let o=e;for(let l=0,a=t.length;l<a;++l){if(null==e)return null;o=o[t[l]]}return o}}return null}function T(e,l){if(null!=e&&l&&l.length)for(const t of l)if(M(e,t))return!0;return!1}function U(l){const t=e.inject(l,void 0),o=e.computed((()=>{return l=t,!(null==(o=e.unref(l))||""===o||Array.isArray(o)&&0===o.length||!(o instanceof Date)&&"object"==typeof o&&0===Object.keys(o).length);var l,o}));return{group:t,isInGroup:o,getGroupOrLocalRef:function(l,o,a){if(null==t?void 0:t.value){const o=e.unref(t.value)[l];return e.computed({get:()=>null==o?void 0:o.value,set(e){o.value=e}})}const n=e.toRef(o,l);return e.computed({get:()=>n.value,set(e){a&&a(`update:${l}`,e)}})}}}const q={...E,...R,...C,...N,...L,...j,iconPosition:{type:String,default:u.left,validator:e=>Object.values(u).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}};const H=l=>e.computed((()=>String((null==l?void 0:l.value)||o.uid())));function G(l,t){const o=e.computed((()=>"string"==typeof(null==l?void 0:l.value)?{name:null==l?void 0:l.value}:null==l?void 0:l.value)),a=e.computed((()=>(null==t?void 0:t.value)===d.before?o.value:void 0)),n=e.computed((()=>(null==t?void 0:t.value)===d.after?o.value:void 0)),r=e.computed((()=>(null==t?void 0:t.value)===u.left?o.value:void 0)),i=e.computed((()=>(null==t?void 0:t.value)===u.right?o.value:void 0)),s=e.computed((()=>(null==t?void 0:t.value)===u.top?o.value:void 0)),c=e.computed((()=>(null==t?void 0:t.value)===u.bottom?o.value:void 0));return{hasIcon:o,hasIconLeft:r,hasIconRight:i,hasIconTop:s,hasIconBottom:c,hasIconBefore:a,hasIconAfter:n}}const J={key:1,class:"vv-button__label"},K={key:1,class:"vv-button__label"},Q=e.defineComponent({name:"VvButton",props:q,emits:["update:modelValue"],setup(l,{expose:t,emit:o}){const a=l,n=e.useAttrs(),r=e.useSlots(),i=o,{id:d,modifiers:s,iconPosition:c,icon:v,label:p,modelValue:m,disabled:g,toggle:y,unselectable:k}=function(l,t){const{group:o,isInGroup:a,getGroupOrLocalRef:n}=U(f),{id:r,iconPosition:i,icon:u,label:d,pressed:s}=e.toRefs(l),c=n("modelValue",l,t),v=n("toggle",l),p=n("unselectable",l),m=e.computed((()=>(null==o?void 0:o.value.multiple.value)??!1)),g=e.computed((()=>{let e=l.modifiers,t=null==o?void 0:o.value.modifiers.value;const a=new Set;return e&&(Array.isArray(e)||(e=e.split(" ")),e.forEach((e=>a.add(e)))),t&&(Array.isArray(t)||(t=t.split(" ")),t.forEach((e=>a.add(e)))),Array.from(a)})),y=e.computed((()=>{var e;return Boolean(l.disabled||(null==(e=null==o?void 0:o.value)?void 0:e.disabled.value))}));return{group:o,isInGroup:a,modelValue:c,toggle:v,unselectable:p,multiple:m,modifiers:g,disabled:y,id:r,pressed:s,iconPosition:i,icon:u,label:d}}(a,i),S=H(d),B=e.computed((()=>(null==n?void 0:n.name)||S.value)),L=e.ref(null);t({$el:e.computed((()=>{var e;return null==(e=L.value)?void 0:e.$el}))});const V=e.computed((()=>y.value?Array.isArray(m.value)?T(B.value,m.value):M(B.value,m.value):a.pressed)),w=b("vv-button",s,e.computed((()=>({reverse:[u.right,u.bottom].includes(c.value),column:[u.top,u.bottom].includes(c.value),"icon-only":Boolean((null==v?void 0:v.value)&&!(null==p?void 0:p.value)&&!r.default)})))),{hasIcon:A}=G(v),$=e.computed((()=>void 0!==a.value?a.value:B.value)),O=()=>{if(y.value){if(Array.isArray(m.value))return T($.value,m.value)?void(k.value&&(m.value=m.value.filter((e=>e!==$.value)))):void m.value.push($.value);if($.value===m.value&&k.value)return void(m.value=a.uncheckedValue);m.value=$.value}};return(l,t)=>(e.openBlock(),e.createBlock(D,e.mergeProps({disabled:e.unref(g),pressed:e.unref(V),active:l.active,type:l.type,to:l.to,href:l.href,target:l.target,rel:l.rel,ariaLabel:l.ariaLabel},{id:e.unref(S),ref_key:"element",ref:L,class:e.unref(w),onClick:O}),{default:e.withCtx((()=>[e.renderSlot(l.$slots,"default",{},(()=>[l.loading?e.renderSlot(l.$slots,"loading",{key:0},(()=>[l.loadingIcon?(e.openBlock(),e.createBlock(h,{key:0,class:"vv-button__loading-icon",name:l.loadingIcon},null,8,["name"])):e.createCommentVNode("v-if",!0),l.loadingLabel?(e.openBlock(),e.createElementBlock("span",J,e.toDisplayString(l.loadingLabel),1)):e.createCommentVNode("v-if",!0)])):(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[e.renderSlot(l.$slots,"before"),e.unref(A)?(e.openBlock(),e.createBlock(h,e.mergeProps({key:0},e.unref(A),{class:"vv-button__icon"}),null,16)):e.createCommentVNode("v-if",!0),e.unref(p)?(e.openBlock(),e.createElementBlock("span",K,[e.renderSlot(l.$slots,"label",{},(()=>[e.createTextVNode(e.toDisplayString(e.unref(p)),1)]))])):e.createCommentVNode("v-if",!0),e.renderSlot(l.$slots,"after")],64))]))])),_:3},16,["id","class"]))}});function W(e){return Array.isArray(e)?e.filter((e=>{return"string"==typeof(l=e)||l instanceof String;var l})).join(" "):e}const X={...P,...C,...S,...B,...x,...O,...L,..._,...j,modelValue:{type:Object,required:!0},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},labelAdd:{type:String,default:"Add file"},iconAdd:{type:[String,Object],default:a},labelReplace:{type:String,default:"Replace file"},iconReplace:{type:[String,Object],default:n},labelDownload:{type:String,default:"Downlaod file"},iconDownload:{type:[String,Object],default:r},labelRemove:{type:String,default:"Remove file"}};const Y=["for"],Z={class:"vv-input-file__preview"},ee=["src","alt"],le={class:"vv-input-file__wrapper"},te=["id","readonly","placeholder","aria-describedby","aria-invalid","aria-errormessage","multiple","accept","capture","name"],oe=["value"],ae={class:"vv-input-file__list"},ne=["onClick"],re=["title","onClick"],ie={class:"vv-input-file__item-name"},ue={class:"vv-input-file__item-info"},de=["title","onClick"];return e.defineComponent({name:"VvInputFile",props:X,emits:["update:modelValue"],setup(t,{emit:o}){const a=t,n=o,r=e.useSlots(),i=function(l,t,o){const a=y(),n=e.computed((()=>{var e;if(a&&(null==(e=a.defaults.value)?void 0:e[l]))return a.defaults.value[l]}));return e.computed((()=>{if(void 0===n.value)return o;const e=n.value,l=t,a=o;return Object.keys(l).reduce(((t,o)=>{const n=a[o];if(t[o]=n,o in e){if(Array.isArray(l[o])){const a=l[o];a.length&&a[0]===n&&(t[o]=e[o])}if("function"==typeof l[o]&&(0,l[o])()===n&&(t[o]=e[o]),"object"==typeof l[o]){let a=l[o].default;"function"==typeof a&&(a=a()),"object"==typeof a?JSON.stringify(a)===JSON.stringify(n)&&(t[o]=e[o]):a===n&&(t[o]=e[o])}}return t}),{})}))}("VvInputFile",X,a),{modifiers:u,id:d,readonly:s,icon:c,iconPosition:v,iconDownload:p}=e.toRefs(a),f=H(d),m=e.computed((()=>`${f.value}-hint`)),g=e.computed((()=>{if(!a.progress)return!1;const e="string"==typeof a.progress?parseInt(a.progress):a.progress;return e>0&&e<100})),{hasIconBefore:k,hasIconAfter:S}=G(c,v),{hasIcon:B}=G(p),L=b("vv-input-file",u,e.computed((()=>({dragging:N.value,loading:a.loading&&!g.value,valid:!0===a.valid,invalid:!0===a.invalid,"icon-before":!!k.value,"icon-after":!!S.value,"drop-area":x.value})))),{HintSlot:V,hasHintLabelOrSlot:w,hasInvalidLabelOrSlot:A,hintSlotScope:$}=function(l,t){const o=e.computed((()=>e.isRef(l)?l.value:l)),a=e.computed((()=>W(o.value.invalidLabel))),n=e.computed((()=>W(o.value.validLabel))),r=e.computed((()=>o.value.loadingLabel)),i=e.computed((()=>o.value.hintLabel)),u=e.computed((()=>Boolean(o.value.loading&&(t.loading||r.value)))),d=e.computed((()=>!u.value&&Boolean(o.value.invalid&&(t.invalid||a.value)))),s=e.computed((()=>!u.value&&!d.value&&Boolean(o.value.valid&&(t.valid||n.value)))),c=e.computed((()=>!u.value&&!d.value&&!s.value&&Boolean(t.hint||i.value))),v=e.computed((()=>d.value||s.value||u.value||c.value)),p=e.computed((()=>({modelValue:o.value.modelValue,valid:o.value.valid,invalid:o.value.invalid,loading:o.value.loading}))),f=e.defineComponent({name:"HintSlot",props:{tag:{type:String,default:"small"}},setup:()=>({isVisible:v,invalidLabel:a,validLabel:n,loadingLabel:r,hintLabel:i,hasInvalidLabelOrSlot:d,hasValidLabelOrSlot:s,hasLoadingLabelOrSlot:u,hasHintLabelOrSlot:c}),render(){var l,t,o,a,n,r,i,u;if(this.isVisible){let d;return this.hasInvalidLabelOrSlot&&(d="alert"),this.hasValidLabelOrSlot&&(d="status"),this.hasLoadingLabelOrSlot?e.h(this.tag,{role:d},(null==(t=(l=this.$slots).loading)?void 0:t.call(l))??this.loadingLabel):this.hasInvalidLabelOrSlot?e.h(this.tag,{role:d},(null==(a=(o=this.$slots).invalid)?void 0:a.call(o))??this.$slots.invalid??this.invalidLabel):this.hasValidLabelOrSlot?e.h(this.tag,{role:d},(null==(r=(n=this.$slots).valid)?void 0:r.call(n))??this.validLabel):e.h(this.tag,{role:d},(null==(u=(i=this.$slots).hint)?void 0:u.call(i))??this.$slots.hint??this.hintLabel)}return null}});return{hasInvalidLabelOrSlot:d,hasHintLabelOrSlot:c,hasValidLabelOrSlot:s,hasLoadingLabelOrSlot:u,hintSlotScope:p,HintSlot:f}}(i,r),O=l.useVModel(a,"modelValue",n),_=e.computed((()=>{var e;return O.value&&(Array.isArray(O.value)||(null==(e=O.value)?void 0:e.name))?Array.isArray(O.value)?O.value:[O.value]:[]})),C=e.computed((()=>"string"==typeof a.max?parseInt(a.max):a.max)),x=e.computed((()=>a.dropArea&&!s.value)),j=e.computed((()=>!!a.multiple&&(!C.value||C.value-_.value.length>1))),N=e.ref(!1),R=e.ref(),P=()=>{N.value=!0},E=()=>{N.value=!1},I=e=>{var l,t;(null==(l=e.dataTransfer)?void 0:l.files)&&(N.value=!1,M(null==(t=e.dataTransfer)?void 0:t.files))},D=()=>{var e;(null==(e=R.value)?void 0:e.files)&&(M(R.value.files),R.value.value="")},M=e=>{if(!a.multiple)return Array.isArray(O.value)?void(O.value=[...e]):void(O.value=e[0]);let l=[];l=!Array.isArray(O.value)&&O.value?[O.value]:O.value&&Array.isArray(O.value)?[...O.value]:l;for(const t of e){if(C.value&&l.length>=C.value)break;l.push(t)}O.value=l,z.value=l.length-1},F=()=>{R.value&&(s.value||R.value.click())},z=e.ref(0),T=["image/jpeg","image/png"],U=e.computed((()=>{if(0===_.value.length)return;if(!_.value[z.value])return;if(_.value[z.value]instanceof File){const e=_.value[z.value];if(!T.includes(e.type))return;return URL.createObjectURL(e)}const e=_.value[z.value];return e.thumbnailUrl?e.thumbnailUrl:T.includes(e.type)?e.url:void 0}));e.watch(U,((e,l)=>{l&&URL.revokeObjectURL(l)})),e.onBeforeUnmount((()=>{U.value&&URL.revokeObjectURL(U.value)}));const q=e=>{if(e)return Math.floor(e/1024)},J=e.computed((()=>0===_.value.length||j.value?a.labelAdd:a.labelReplace)),K=e.computed((()=>0===_.value.length||j.value?a.iconAdd:a.iconReplace));return(l,t)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(e.unref(L))},[l.label?(e.openBlock(),e.createElementBlock("label",{key:0,for:e.unref(f)},e.toDisplayString(l.label),9,Y)):e.createCommentVNode("v-if",!0),x.value?(e.openBlock(),e.createElementBlock("div",{key:1,class:"vv-input-file__drop-area",onDragenter:e.withModifiers(P,["prevent","stop"]),onDragleave:e.withModifiers(E,["prevent","stop"]),onDrop:e.withModifiers(I,["prevent","stop"]),onDragover:t[0]||(t[0]=e.withModifiers((()=>{}),["prevent","stop"])),onClick:e.withModifiers(F,["stop"])},[e.renderSlot(l.$slots,"drop-area",{},(()=>[e.createElementVNode("picture",Z,[U.value?(e.openBlock(),e.createElementBlock("img",{key:0,src:U.value,alt:_.value[z.value].name},null,8,ee)):e.createCommentVNode("v-if",!0)]),e.unref(s)?e.createCommentVNode("v-if",!0):(e.openBlock(),e.createBlock(Q,{key:0,modifiers:"action",label:U.value?void 0:J.value,title:U.value?J.value:void 0,class:e.normalizeClass({"vv-input-file__drop-area-action":U.value}),icon:K.value,onClick:e.withModifiers(F,["stop"])},null,8,["label","title","class","icon"]))]))],32)):e.createCommentVNode("v-if",!0),e.createElementVNode("div",le,[e.unref(k)?(e.openBlock(),e.createBlock(h,e.normalizeProps(e.mergeProps({key:0},e.unref(k))),null,16)):e.createCommentVNode("v-if",!0),e.createElementVNode("input",{id:e.unref(f),ref_key:"inputEl",ref:R,type:"file",readonly:e.unref(s),placeholder:l.placeholder,"aria-describedby":e.unref(w)?m.value:void 0,"aria-invalid":l.invalid,"aria-errormessage":e.unref(A)?m.value:void 0,multiple:j.value,accept:l.accept,capture:l.capture,name:l.name,onChange:D},null,40,te),g.value?(e.openBlock(),e.createElementBlock("progress",{key:1,class:"vv-input-file__progress",value:l.progress,max:"100"},e.toDisplayString(l.progress)+"% ",9,oe)):e.createCommentVNode("v-if",!0),e.unref(S)?(e.openBlock(),e.createBlock(h,e.normalizeProps(e.mergeProps({key:2},e.unref(S))),null,16)):e.createCommentVNode("v-if",!0)]),e.createElementVNode("ul",ae,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(_.value,((t,o)=>(e.openBlock(),e.createElementBlock("li",{key:o,class:e.normalizeClass(["vv-input-file__item",{active:o===z.value&&x.value&&_.value.length>1}]),onClick:e.withModifiers((e=>(e=>{z.value=e})(o)),["stop"])},[e.unref(B)?(e.openBlock(),e.createElementBlock("button",{key:0,type:"button",class:"vv-input-file__item-action",title:l.labelDownload,onClick:e.withModifiers((e=>(e=>{const l=document.createElement("a");e instanceof File?l.href=URL.createObjectURL(e):e.url&&(l.href=e.url),l.setAttribute("download",e.name),document.body.appendChild(l),l.click(),document.body.removeChild(l),URL.revokeObjectURL(l.href)})(t)),["stop"])},[e.createVNode(h,e.normalizeProps(e.guardReactiveProps(e.unref(B))),null,16)],8,re)):e.createCommentVNode("v-if",!0),e.createElementVNode("div",ie,e.toDisplayString(t.name),1),e.createElementVNode("small",ue,e.toDisplayString(q(t.size))+" KB ",1),e.unref(s)?e.createCommentVNode("v-if",!0):(e.openBlock(),e.createElementBlock("button",{key:1,type:"button",class:"vv-input-file__item-remove",title:l.labelRemove,onClick:e.withModifiers((e=>(e=>{if(!Array.isArray(O.value))return void(O.value=void 0);z.value===e&&(z.value=0);const l=[...O.value];l.splice(e,1),O.value=l})(o)),["stop"])},null,8,de))],10,ne)))),128))]),e.createVNode(e.unref(V),{id:m.value,class:"vv-input-file__hint"},e.createSlots({_:2},[l.$slots.hint?{name:"hint",fn:e.withCtx((()=>[e.renderSlot(l.$slots,"hint",e.normalizeProps(e.guardReactiveProps(e.unref($))))])),key:"0"}:void 0,l.$slots.loading?{name:"loading",fn:e.withCtx((()=>[e.renderSlot(l.$slots,"loading",e.normalizeProps(e.guardReactiveProps(e.unref($))))])),key:"1"}:void 0,l.$slots.valid?{name:"valid",fn:e.withCtx((()=>[e.renderSlot(l.$slots,"valid",e.normalizeProps(e.guardReactiveProps(e.unref($))))])),key:"2"}:void 0,l.$slots.invalid?{name:"invalid",fn:e.withCtx((()=>[e.renderSlot(l.$slots,"invalid",e.normalizeProps(e.guardReactiveProps(e.unref($))))])),key:"3"}:void 0]),1032,["id"])],2))}})}));
|
|
@@ -14,7 +14,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
|
|
|
14
14
|
url: string;
|
|
15
15
|
thumbnailUrl?: string | undefined;
|
|
16
16
|
lastModified?: number | undefined;
|
|
17
|
-
} | File)[]>;
|
|
17
|
+
} | File)[] | undefined>;
|
|
18
18
|
required: boolean;
|
|
19
19
|
};
|
|
20
20
|
progress: {
|
|
@@ -33,6 +33,11 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
|
|
|
33
33
|
type: BooleanConstructor;
|
|
34
34
|
default: boolean;
|
|
35
35
|
};
|
|
36
|
+
capture: {
|
|
37
|
+
type: globalThis.PropType<"user" | "environment">;
|
|
38
|
+
default: undefined;
|
|
39
|
+
validation: (value?: string | undefined) => boolean;
|
|
40
|
+
};
|
|
36
41
|
max: {
|
|
37
42
|
type: (StringConstructor | NumberConstructor)[];
|
|
38
43
|
default: undefined;
|
|
@@ -124,7 +129,21 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
|
|
|
124
129
|
};
|
|
125
130
|
id: (StringConstructor | NumberConstructor)[];
|
|
126
131
|
}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
|
127
|
-
"update:modelValue": (args_0:
|
|
132
|
+
"update:modelValue": (args_0: {
|
|
133
|
+
name: string;
|
|
134
|
+
size: number;
|
|
135
|
+
type: string;
|
|
136
|
+
url: string;
|
|
137
|
+
thumbnailUrl?: string | undefined;
|
|
138
|
+
lastModified?: number | undefined;
|
|
139
|
+
} | File | ({
|
|
140
|
+
name: string;
|
|
141
|
+
size: number;
|
|
142
|
+
type: string;
|
|
143
|
+
url: string;
|
|
144
|
+
thumbnailUrl?: string | undefined;
|
|
145
|
+
lastModified?: number | undefined;
|
|
146
|
+
} | File)[] | undefined) => void;
|
|
128
147
|
}, string, import("vue").PublicProps, Readonly<globalThis.ExtractPropTypes<{
|
|
129
148
|
modelValue: {
|
|
130
149
|
type: globalThis.PropType<{
|
|
@@ -141,7 +160,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
|
|
|
141
160
|
url: string;
|
|
142
161
|
thumbnailUrl?: string | undefined;
|
|
143
162
|
lastModified?: number | undefined;
|
|
144
|
-
} | File)[]>;
|
|
163
|
+
} | File)[] | undefined>;
|
|
145
164
|
required: boolean;
|
|
146
165
|
};
|
|
147
166
|
progress: {
|
|
@@ -160,6 +179,11 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
|
|
|
160
179
|
type: BooleanConstructor;
|
|
161
180
|
default: boolean;
|
|
162
181
|
};
|
|
182
|
+
capture: {
|
|
183
|
+
type: globalThis.PropType<"user" | "environment">;
|
|
184
|
+
default: undefined;
|
|
185
|
+
validation: (value?: string | undefined) => boolean;
|
|
186
|
+
};
|
|
163
187
|
max: {
|
|
164
188
|
type: (StringConstructor | NumberConstructor)[];
|
|
165
189
|
default: undefined;
|
|
@@ -251,7 +275,21 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
|
|
|
251
275
|
};
|
|
252
276
|
id: (StringConstructor | NumberConstructor)[];
|
|
253
277
|
}>> & {
|
|
254
|
-
"onUpdate:modelValue"?: ((args_0:
|
|
278
|
+
"onUpdate:modelValue"?: ((args_0: {
|
|
279
|
+
name: string;
|
|
280
|
+
size: number;
|
|
281
|
+
type: string;
|
|
282
|
+
url: string;
|
|
283
|
+
thumbnailUrl?: string | undefined;
|
|
284
|
+
lastModified?: number | undefined;
|
|
285
|
+
} | File | ({
|
|
286
|
+
name: string;
|
|
287
|
+
size: number;
|
|
288
|
+
type: string;
|
|
289
|
+
url: string;
|
|
290
|
+
thumbnailUrl?: string | undefined;
|
|
291
|
+
lastModified?: number | undefined;
|
|
292
|
+
} | File)[] | undefined) => any) | undefined;
|
|
255
293
|
}, {
|
|
256
294
|
readonly: boolean;
|
|
257
295
|
valid: boolean;
|
|
@@ -269,6 +307,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
|
|
|
269
307
|
validLabel: string | unknown[];
|
|
270
308
|
placeholder: string;
|
|
271
309
|
accept: string;
|
|
310
|
+
capture: "user" | "environment";
|
|
272
311
|
max: string | number;
|
|
273
312
|
dropArea: boolean;
|
|
274
313
|
labelAdd: string;
|
|
@@ -1,6 +1,9 @@
|
|
|
1
|
+
import type { UploadedFile } from '@/types';
|
|
1
2
|
import { type VvIconProps } from '../VvIcon';
|
|
2
3
|
export type VvInputFileEvents = {
|
|
3
|
-
'update:modelValue': [
|
|
4
|
+
'update:modelValue': [
|
|
5
|
+
File | UploadedFile | (File | UploadedFile)[] | undefined
|
|
6
|
+
];
|
|
4
7
|
};
|
|
5
8
|
export declare const VvInputFileProps: {
|
|
6
9
|
/**
|
|
@@ -21,7 +24,7 @@ export declare const VvInputFileProps: {
|
|
|
21
24
|
url: string;
|
|
22
25
|
thumbnailUrl?: string | undefined;
|
|
23
26
|
lastModified?: number | undefined;
|
|
24
|
-
} | File)[]>;
|
|
27
|
+
} | File)[] | undefined>;
|
|
25
28
|
required: boolean;
|
|
26
29
|
};
|
|
27
30
|
/**
|
|
@@ -56,6 +59,15 @@ export declare const VvInputFileProps: {
|
|
|
56
59
|
type: BooleanConstructor;
|
|
57
60
|
default: boolean;
|
|
58
61
|
};
|
|
62
|
+
/**
|
|
63
|
+
* Front or rear camera
|
|
64
|
+
* @see https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/capture
|
|
65
|
+
*/
|
|
66
|
+
capture: {
|
|
67
|
+
type: globalThis.PropType<"user" | "environment">;
|
|
68
|
+
default: undefined;
|
|
69
|
+
validation: (value?: string) => boolean;
|
|
70
|
+
};
|
|
59
71
|
/**
|
|
60
72
|
* Max number of files
|
|
61
73
|
*/
|
|
@@ -6990,6 +6990,20 @@ const VvInputFileProps = {
|
|
|
6990
6990
|
* @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#multiple
|
|
6991
6991
|
*/
|
|
6992
6992
|
multiple: { type: Boolean, default: false },
|
|
6993
|
+
/**
|
|
6994
|
+
* Front or rear camera
|
|
6995
|
+
* @see https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/capture
|
|
6996
|
+
*/
|
|
6997
|
+
capture: {
|
|
6998
|
+
type: String,
|
|
6999
|
+
default: void 0,
|
|
7000
|
+
validation: (value) => {
|
|
7001
|
+
if (value === void 0) {
|
|
7002
|
+
return true;
|
|
7003
|
+
}
|
|
7004
|
+
return ["user", "environment"].includes(value);
|
|
7005
|
+
}
|
|
7006
|
+
},
|
|
6993
7007
|
/**
|
|
6994
7008
|
* Max number of files
|
|
6995
7009
|
*/
|
|
@@ -7055,7 +7069,7 @@ const _hoisted_1 = ["for"];
|
|
|
7055
7069
|
const _hoisted_2 = { class: "vv-input-file__preview" };
|
|
7056
7070
|
const _hoisted_3 = ["src", "alt"];
|
|
7057
7071
|
const _hoisted_4 = { class: "vv-input-file__wrapper" };
|
|
7058
|
-
const _hoisted_5 = ["id", "readonly", "placeholder", "aria-describedby", "aria-invalid", "aria-errormessage", "multiple", "accept", "name"];
|
|
7072
|
+
const _hoisted_5 = ["id", "readonly", "placeholder", "aria-describedby", "aria-invalid", "aria-errormessage", "multiple", "accept", "capture", "name"];
|
|
7059
7073
|
const _hoisted_6 = ["value"];
|
|
7060
7074
|
const _hoisted_7 = { class: "vv-input-file__list" };
|
|
7061
7075
|
const _hoisted_8 = ["onClick"];
|
|
@@ -7338,6 +7352,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
7338
7352
|
"aria-errormessage": unref(hasInvalidLabelOrSlot) ? hasHintId.value : void 0,
|
|
7339
7353
|
multiple: isMultiple.value,
|
|
7340
7354
|
accept: _ctx.accept,
|
|
7355
|
+
capture: _ctx.capture,
|
|
7341
7356
|
name: _ctx.name,
|
|
7342
7357
|
onChange
|
|
7343
7358
|
}, null, 40, _hoisted_5),
|