primevue 3.26.0 → 3.27.0

package/fileupload/fileupload.esm.min.js

@@ -1 +1 @@
-import e from"primevue/button";import l from"primevue/message";import i from"primevue/progressbar";import t from"primevue/ripple";import{DomHandler as s}from"primevue/utils";import o from"primevue/badge";import{resolveComponent as a,openBlock as n,createElementBlock as p,Fragment as d,renderList as r,createElementVNode as u,toDisplayString as h,createVNode as c,resolveDirective as f,renderSlot as m,withDirectives as g,normalizeClass as b,normalizeStyle as v,withKeys as F,createBlock as y,createCommentVNode as B,withCtx as C,createTextVNode as L}from"vue";var S={emits:["remove"],props:{files:{type:Array,default:()=>[]},badgeSeverity:{type:String,default:"warning"},badgeValue:{type:String,default:null},previewWidth:{type:Number,default:50}},methods:{formatSize(e){if(0===e)return"0 B";let l=Math.floor(Math.log(e)/Math.log(1e3));return parseFloat((e/Math.pow(1e3,l)).toFixed(3))+" "+["B","KB","MB","GB","TB","PB","EB","ZB","YB"][l]}},components:{FileUploadButton:e,FileUploadBadge:o}};const w=["alt","src","width"],I={class:"p-fileupload-file-details"},x={class:"p-fileupload-file-name"},E={class:"p-fileupload-file-size"},k={class:"p-fileupload-file-actions"};S.render=function(e,l,i,t,s,o){const f=a("FileUploadBadge"),m=a("FileUploadButton");return n(!0),p(d,null,r(i.files,((l,t)=>(n(),p("div",{key:l.name+l.type+l.size,class:"p-fileupload-file"},[u("img",{role:"presentation",class:"p-fileupload-file-thumbnail",alt:l.name,src:l.objectURL,width:i.previewWidth},null,8,w),u("div",I,[u("div",x,h(l.name),1),u("span",E,h(o.formatSize(l.size)),1),c(f,{value:i.badgeValue,class:"p-fileupload-file-badge",severity:i.badgeSeverity},null,8,["value","severity"])]),u("div",k,[c(m,{icon:"pi pi-times",onClick:l=>e.$emit("remove",t),class:"p-fileupload-file-remove p-button-text p-button-danger p-button-rounded"},null,8,["onClick"])])])))),128)};var D={name:"FileUpload",emits:["select","uploader","before-upload","progress","upload","error","before-send","clear","remove","remove-uploaded-file"],props:{name:{type:String,default:null},url:{type:String,default:null},mode:{type:String,default:"advanced"},multiple:{type:Boolean,default:!1},accept:{type:String,default:null},disabled:{type:Boolean,default:!1},auto:{type:Boolean,default:!1},maxFileSize:{type:Number,default:null},invalidFileSizeMessage:{type:String,default:"{0}: Invalid file size, file size should be smaller than {1}."},invalidFileTypeMessage:{type:String,default:"{0}: Invalid file type, allowed file types: {1}."},fileLimit:{type:Number,default:null},invalidFileLimitMessage:{type:String,default:"Maximum number of files exceeded, limit is {0} at most."},withCredentials:{type:Boolean,default:!1},previewWidth:{type:Number,default:50},chooseLabel:{type:String,default:null},uploadLabel:{type:String,default:null},cancelLabel:{type:String,default:null},customUpload:{type:Boolean,default:!1},showUploadButton:{type:Boolean,default:!0},showCancelButton:{type:Boolean,default:!0},chooseIcon:{type:String,default:"pi pi-plus"},uploadIcon:{type:String,default:"pi pi-upload"},cancelIcon:{type:String,default:"pi pi-times"},style:null,class:null},duplicateIEEvent:!1,data:()=>({uploadedFileCount:0,files:[],messages:[],focused:!1,progress:null,uploadedFiles:[]}),methods:{onFileSelect(e){if("drop"!==e.type&&this.isIE11()&&this.duplicateIEEvent)return void(this.duplicateIEEvent=!1);this.messages=[],this.files=this.files||[];let l=e.dataTransfer?e.dataTransfer.files:e.target.files;for(let e of l)this.isFileSelected(e)||this.validate(e)&&(this.isImage(e)&&(e.objectURL=window.URL.createObjectURL(e)),this.files.push(e));this.$emit("select",{originalEvent:e,files:this.files}),this.fileLimit&&this.checkFileLimit(),this.auto&&this.hasFiles&&!this.isFileLimitExceeded()&&this.upload(),"drop"!==e.type&&this.isIE11()?this.clearIEInput():this.clearInputElement()},choose(){this.$refs.fileInput.click()},upload(){if(this.customUpload)this.fileLimit&&(this.uploadedFileCount+=this.files.length),this.$emit("uploader",{files:this.files}),this.clear();else{let e=new XMLHttpRequest,l=new FormData;this.$emit("before-upload",{xhr:e,formData:l});for(let e of this.files)l.append(this.name,e,e.name);e.upload.addEventListener("progress",(e=>{e.lengthComputable&&(this.progress=Math.round(100*e.loaded/e.total)),this.$emit("progress",{originalEvent:e,progress:this.progress})})),e.onreadystatechange=()=>{4===e.readyState&&(this.progress=0,e.status>=200&&e.status<300?(this.fileLimit&&(this.uploadedFileCount+=this.files.length),this.$emit("upload",{xhr:e,files:this.files})):this.$emit("error",{xhr:e,files:this.files}),this.uploadedFiles.push(...this.files),this.clear())},e.open("POST",this.url,!0),this.$emit("before-send",{xhr:e,formData:l}),e.withCredentials=this.withCredentials,e.send(l)}},clear(){this.files=[],this.messages=null,this.$emit("clear"),this.isAdvanced&&this.clearInputElement()},onFocus(){this.focused=!0},onBlur(){this.focused=!1},isFileSelected(e){if(this.files&&this.files.length)for(let l of this.files)if(l.name+l.type+l.size===e.name+e.type+e.size)return!0;return!1},isIE11:()=>!!window.MSInputMethodContext&&!!document.documentMode,validate(e){return this.accept&&!this.isFileTypeValid(e)?(this.messages.push(this.invalidFileTypeMessage.replace("{0}",e.name).replace("{1}",this.accept)),!1):!(this.maxFileSize&&e.size>this.maxFileSize)||(this.messages.push(this.invalidFileSizeMessage.replace("{0}",e.name).replace("{1}",this.formatSize(this.maxFileSize))),!1)},isFileTypeValid(e){let l=this.accept.split(",").map((e=>e.trim()));for(let i of l){if(this.isWildcard(i)?this.getTypeClass(e.type)===this.getTypeClass(i):e.type==i||this.getFileExtension(e).toLowerCase()===i.toLowerCase())return!0}return!1},getTypeClass:e=>e.substring(0,e.indexOf("/")),isWildcard:e=>-1!==e.indexOf("*"),getFileExtension:e=>"."+e.name.split(".").pop(),isImage:e=>/^image\//.test(e.type),onDragEnter(e){this.disabled||(e.stopPropagation(),e.preventDefault())},onDragOver(e){this.disabled||(s.addClass(this.$refs.content,"p-fileupload-highlight"),e.stopPropagation(),e.preventDefault())},onDragLeave(){this.disabled||s.removeClass(this.$refs.content,"p-fileupload-highlight")},onDrop(e){if(!this.disabled){s.removeClass(this.$refs.content,"p-fileupload-highlight"),e.stopPropagation(),e.preventDefault();const l=e.dataTransfer?e.dataTransfer.files:e.target.files;(this.multiple||l&&1===l.length)&&this.onFileSelect(e)}},onBasicUploaderClick(){this.hasFiles?this.upload():this.$refs.fileInput.click()},remove(e){this.clearInputElement();let l=this.files.splice(e,1)[0];this.files=[...this.files],this.$emit("remove",{file:l,files:this.files})},removeUploadedFile(e){let l=this.uploadedFiles.splice(e,1)[0];this.uploadedFiles=[...this.uploadedFiles],this.$emit("remove-uploaded-file",{file:l,files:this.uploadedFiles})},clearInputElement(){this.$refs.fileInput.value=""},clearIEInput(){this.$refs.fileInput&&(this.duplicateIEEvent=!0,this.$refs.fileInput.value="")},formatSize(e){if(0===e)return"0 B";let l=Math.floor(Math.log(e)/Math.log(1e3));return parseFloat((e/Math.pow(1e3,l)).toFixed(3))+" "+["B","KB","MB","GB","TB","PB","EB","ZB","YB"][l]},isFileLimitExceeded(){return this.fileLimit&&this.fileLimit<=this.files.length+this.uploadedFileCount&&this.focused&&(this.focused=!1),this.fileLimit&&this.fileLimit<this.files.length+this.uploadedFileCount},checkFileLimit(){this.isFileLimitExceeded()&&this.messages.push(this.invalidFileLimitMessage.replace("{0}",this.fileLimit.toString()))},onMessageClose(){this.messages=null}},computed:{isAdvanced(){return"advanced"===this.mode},isBasic(){return"basic"===this.mode},advancedChooseButtonClass(){return["p-button p-component p-fileupload-choose",this.class,{"p-disabled":this.disabled,"p-focus":this.focused}]},basicChooseButtonClass(){return["p-button p-component p-fileupload-choose",this.class,{"p-fileupload-choose-selected":this.hasFiles,"p-disabled":this.disabled,"p-focus":this.focused}]},advancedChooseIconClass(){return["p-button-icon p-button-icon-left pi-fw",this.chooseIcon]},basicChooseButtonIconClass(){return["p-button-icon p-button-icon-left",!this.hasFiles||this.auto?this.uploadIcon:this.chooseIcon]},basicChooseButtonLabel(){return this.auto?this.chooseButtonLabel:this.hasFiles?this.files.map((e=>e.name)).join(", "):this.chooseButtonLabel},hasFiles(){return this.files&&this.files.length>0},hasUploadedFiles(){return this.uploadedFiles&&this.uploadedFiles.length>0},chooseDisabled(){return this.disabled||this.fileLimit&&this.fileLimit<=this.files.length+this.uploadedFileCount},uploadDisabled(){return this.disabled||!this.hasFiles||this.fileLimit&&this.fileLimit<this.files.length},cancelDisabled(){return this.disabled||!this.hasFiles},chooseButtonLabel(){return this.chooseLabel||this.$primevue.config.locale.choose},uploadButtonLabel(){return this.uploadLabel||this.$primevue.config.locale.upload},cancelButtonLabel(){return this.cancelLabel||this.$primevue.config.locale.cancel},completedLabel(){return this.$primevue.config.locale.completed},pendingLabel(){return this.$primevue.config.locale.pending}},components:{FileUploadButton:e,FileUploadProgressBar:i,FileUploadMessage:l,FileContent:S},directives:{ripple:t}};const M={key:0,class:"p-fileupload p-fileupload-advanced p-component"},U=["multiple","accept","disabled"],$={class:"p-fileupload-buttonbar"},z={class:"p-button-label"},T={key:0,class:"p-fileupload-empty"},W={key:1,class:"p-fileupload p-fileupload-basic p-component"},R={class:"p-button-label"},V=["accept","disabled","multiple"];!function(e,l){void 0===l&&(l={});var i=l.insertAt;if(e&&"undefined"!=typeof document){var t=document.head||document.getElementsByTagName("head")[0],s=document.createElement("style");s.type="text/css","top"===i&&t.firstChild?t.insertBefore(s,t.firstChild):t.appendChild(s),s.styleSheet?s.styleSheet.cssText=e:s.appendChild(document.createTextNode(e))}}("\n.p-fileupload-content {\n    position: relative;\n}\n.p-fileupload-content .p-progressbar {\n    width: 100%;\n    position: absolute;\n    top: 0;\n    left: 0;\n}\n.p-button.p-fileupload-choose {\n    position: relative;\n    overflow: hidden;\n}\n.p-fileupload-buttonbar {\n    display: flex;\n    flex-wrap: wrap;\n}\n.p-fileupload > input[type='file'],\n.p-fileupload-basic input[type='file'] {\n    display: none;\n}\n.p-fluid .p-fileupload .p-button {\n    width: auto;\n}\n.p-fileupload-file {\n    display: flex;\n    flex-wrap: wrap;\n    align-items: center;\n}\n.p-fileupload-file-thumbnail {\n    flex-shrink: 0;\n}\n.p-fileupload-file-actions {\n    margin-left: auto;\n}\n"),D.render=function(e,l,i,t,s,o){const S=a("FileUploadButton"),w=a("FileUploadProgressBar"),I=a("FileUploadMessage"),x=a("FileContent"),E=f("ripple");return o.isAdvanced?(n(),p("div",M,[u("input",{ref:"fileInput",type:"file",onChange:l[0]||(l[0]=(...e)=>o.onFileSelect&&o.onFileSelect(...e)),multiple:i.multiple,accept:i.accept,disabled:o.chooseDisabled},null,40,U),u("div",$,[m(e.$slots,"header",{files:s.files,uploadedFiles:s.uploadedFiles,chooseCallback:o.choose,uploadCallback:o.upload,clearCallback:o.clear},(()=>[g((n(),p("span",{class:b(o.advancedChooseButtonClass),style:v(i.style),onClick:l[1]||(l[1]=(...e)=>o.choose&&o.choose(...e)),onKeydown:l[2]||(l[2]=F(((...e)=>o.choose&&o.choose(...e)),["enter"])),onFocus:l[3]||(l[3]=(...e)=>o.onFocus&&o.onFocus(...e)),onBlur:l[4]||(l[4]=(...e)=>o.onBlur&&o.onBlur(...e)),tabindex:"0"},[u("span",{class:b(o.advancedChooseIconClass)},null,2),u("span",z,h(o.chooseButtonLabel),1)],38)),[[E]]),i.showUploadButton?(n(),y(S,{key:0,label:o.uploadButtonLabel,icon:i.uploadIcon,onClick:o.upload,disabled:o.uploadDisabled},null,8,["label","icon","onClick","disabled"])):B("",!0),i.showCancelButton?(n(),y(S,{key:1,label:o.cancelButtonLabel,icon:i.cancelIcon,onClick:o.clear,disabled:o.cancelDisabled},null,8,["label","icon","onClick","disabled"])):B("",!0)]))]),u("div",{ref:"content",class:"p-fileupload-content",onDragenter:l[5]||(l[5]=(...e)=>o.onDragEnter&&o.onDragEnter(...e)),onDragover:l[6]||(l[6]=(...e)=>o.onDragOver&&o.onDragOver(...e)),onDragleave:l[7]||(l[7]=(...e)=>o.onDragLeave&&o.onDragLeave(...e)),onDrop:l[8]||(l[8]=(...e)=>o.onDrop&&o.onDrop(...e))},[m(e.$slots,"content",{files:s.files,uploadedFiles:s.uploadedFiles,removeUploadedFileCallback:o.removeUploadedFile,removeFileCallback:o.remove,progress:s.progress,messages:s.messages},(()=>[o.hasFiles?(n(),y(w,{key:0,value:s.progress,showValue:!1},null,8,["value"])):B("",!0),(n(!0),p(d,null,r(s.messages,(e=>(n(),y(I,{key:e,severity:"error",onClose:o.onMessageClose},{default:C((()=>[L(h(e),1)])),_:2},1032,["onClose"])))),128)),o.hasFiles?(n(),y(x,{key:1,files:s.files,onRemove:o.remove,badgeValue:o.pendingLabel,previewWidth:i.previewWidth},null,8,["files","onRemove","badgeValue","previewWidth"])):B("",!0),c(x,{files:s.uploadedFiles,onRemove:o.removeUploadedFile,badgeValue:o.completedLabel,badgeSeverity:"success",previewWidth:i.previewWidth},null,8,["files","onRemove","badgeValue","previewWidth"])])),!e.$slots.empty||o.hasFiles||o.hasUploadedFiles?B("",!0):(n(),p("div",T,[m(e.$slots,"empty")]))],544)])):o.isBasic?(n(),p("div",W,[(n(!0),p(d,null,r(s.messages,(e=>(n(),y(I,{key:e,severity:"error",onClose:o.onMessageClose},{default:C((()=>[L(h(e),1)])),_:2},1032,["onClose"])))),128)),g((n(),p("span",{class:b(o.basicChooseButtonClass),style:v(i.style),onMouseup:l[12]||(l[12]=(...e)=>o.onBasicUploaderClick&&o.onBasicUploaderClick(...e)),onKeydown:l[13]||(l[13]=F(((...e)=>o.choose&&o.choose(...e)),["enter"])),onFocus:l[14]||(l[14]=(...e)=>o.onFocus&&o.onFocus(...e)),onBlur:l[15]||(l[15]=(...e)=>o.onBlur&&o.onBlur(...e)),tabindex:"0"},[u("span",{class:b(o.basicChooseButtonIconClass)},null,2),u("span",R,h(o.basicChooseButtonLabel),1),o.hasFiles?B("",!0):(n(),p("input",{key:0,ref:"fileInput",type:"file",accept:i.accept,disabled:i.disabled,multiple:i.multiple,onChange:l[9]||(l[9]=(...e)=>o.onFileSelect&&o.onFileSelect(...e)),onFocus:l[10]||(l[10]=(...e)=>o.onFocus&&o.onFocus(...e)),onBlur:l[11]||(l[11]=(...e)=>o.onBlur&&o.onBlur(...e))},null,40,V))],38)),[[E]])])):B("",!0)};export{D as default};
+import e from"primevue/button";import l from"primevue/icons/plus";import i from"primevue/icons/times";import t from"primevue/icons/upload";import s from"primevue/message";import o from"primevue/progressbar";import a from"primevue/ripple";import{DomHandler as n}from"primevue/utils";import d from"primevue/badge";import{resolveComponent as p,openBlock as r,createElementBlock as u,Fragment as c,renderList as h,createElementVNode as f,toDisplayString as m,createVNode as g,withCtx as v,createBlock as b,resolveDynamicComponent as y,normalizeClass as F,resolveDirective as B,renderSlot as C,withDirectives as L,normalizeStyle as I,withKeys as S,createCommentVNode as w,createTextVNode as k}from"vue";var $={emits:["remove"],props:{files:{type:Array,default:()=>[]},badgeSeverity:{type:String,default:"warning"},badgeValue:{type:String,default:null},previewWidth:{type:Number,default:50},templates:{type:null,default:null}},methods:{formatSize(e){if(0===e)return"0 B";let l=Math.floor(Math.log(e)/Math.log(1e3));return parseFloat((e/Math.pow(1e3,l)).toFixed(3))+" "+["B","KB","MB","GB","TB","PB","EB","ZB","YB"][l]}},components:{FileUploadButton:e,FileUploadBadge:d,TimesIcon:i}};const x=["alt","src","width"],E={class:"p-fileupload-file-details"},U={class:"p-fileupload-file-name"},D={class:"p-fileupload-file-size"},M={class:"p-fileupload-file-actions"};$.render=function(e,l,i,t,s,o){const a=p("FileUploadBadge"),n=p("TimesIcon"),d=p("FileUploadButton");return r(!0),u(c,null,h(i.files,((l,t)=>(r(),u("div",{key:l.name+l.type+l.size,class:"p-fileupload-file"},[f("img",{role:"presentation",class:"p-fileupload-file-thumbnail",alt:l.name,src:l.objectURL,width:i.previewWidth},null,8,x),f("div",E,[f("div",U,m(l.name),1),f("span",D,m(o.formatSize(l.size)),1),g(a,{value:i.badgeValue,class:"p-fileupload-file-badge",severity:i.badgeSeverity},null,8,["value","severity"])]),f("div",M,[g(d,{onClick:l=>e.$emit("remove",t),text:"",rounded:"",severity:"danger",class:"p-fileupload-file-remove"},{icon:v((e=>[i.templates.fileremoveicon?(r(),b(y(i.templates.fileremoveicon),{key:0,class:F(e.class),file:l,index:t},null,8,["class","file","index"])):(r(),b(n,{key:1,class:F(e.class),"aria-hidden":"true"},null,8,["class"]))])),_:2},1032,["onClick"])])])))),128)};var T={name:"FileUpload",emits:["select","uploader","before-upload","progress","upload","error","before-send","clear","remove","remove-uploaded-file"],props:{name:{type:String,default:null},url:{type:String,default:null},mode:{type:String,default:"advanced"},multiple:{type:Boolean,default:!1},accept:{type:String,default:null},disabled:{type:Boolean,default:!1},auto:{type:Boolean,default:!1},maxFileSize:{type:Number,default:null},invalidFileSizeMessage:{type:String,default:"{0}: Invalid file size, file size should be smaller than {1}."},invalidFileTypeMessage:{type:String,default:"{0}: Invalid file type, allowed file types: {1}."},fileLimit:{type:Number,default:null},invalidFileLimitMessage:{type:String,default:"Maximum number of files exceeded, limit is {0} at most."},withCredentials:{type:Boolean,default:!1},previewWidth:{type:Number,default:50},chooseLabel:{type:String,default:null},uploadLabel:{type:String,default:null},cancelLabel:{type:String,default:null},customUpload:{type:Boolean,default:!1},showUploadButton:{type:Boolean,default:!0},showCancelButton:{type:Boolean,default:!0},chooseIcon:{type:String,default:void 0},uploadIcon:{type:String,default:void 0},cancelIcon:{type:String,default:void 0},style:null,class:null},duplicateIEEvent:!1,data:()=>({uploadedFileCount:0,files:[],messages:[],focused:!1,progress:null,uploadedFiles:[]}),methods:{onFileSelect(e){if("drop"!==e.type&&this.isIE11()&&this.duplicateIEEvent)return void(this.duplicateIEEvent=!1);this.messages=[],this.files=this.files||[];let l=e.dataTransfer?e.dataTransfer.files:e.target.files;for(let e of l)this.isFileSelected(e)||this.validate(e)&&(this.isImage(e)&&(e.objectURL=window.URL.createObjectURL(e)),this.files.push(e));this.$emit("select",{originalEvent:e,files:this.files}),this.fileLimit&&this.checkFileLimit(),this.auto&&this.hasFiles&&!this.isFileLimitExceeded()&&this.upload(),"drop"!==e.type&&this.isIE11()?this.clearIEInput():this.clearInputElement()},choose(){this.$refs.fileInput.click()},upload(){if(this.customUpload)this.fileLimit&&(this.uploadedFileCount+=this.files.length),this.$emit("uploader",{files:this.files}),this.clear();else{let e=new XMLHttpRequest,l=new FormData;this.$emit("before-upload",{xhr:e,formData:l});for(let e of this.files)l.append(this.name,e,e.name);e.upload.addEventListener("progress",(e=>{e.lengthComputable&&(this.progress=Math.round(100*e.loaded/e.total)),this.$emit("progress",{originalEvent:e,progress:this.progress})})),e.onreadystatechange=()=>{4===e.readyState&&(this.progress=0,e.status>=200&&e.status<300?(this.fileLimit&&(this.uploadedFileCount+=this.files.length),this.$emit("upload",{xhr:e,files:this.files})):this.$emit("error",{xhr:e,files:this.files}),this.uploadedFiles.push(...this.files),this.clear())},e.open("POST",this.url,!0),this.$emit("before-send",{xhr:e,formData:l}),e.withCredentials=this.withCredentials,e.send(l)}},clear(){this.files=[],this.messages=null,this.$emit("clear"),this.isAdvanced&&this.clearInputElement()},onFocus(){this.focused=!0},onBlur(){this.focused=!1},isFileSelected(e){if(this.files&&this.files.length)for(let l of this.files)if(l.name+l.type+l.size===e.name+e.type+e.size)return!0;return!1},isIE11:()=>!!window.MSInputMethodContext&&!!document.documentMode,validate(e){return this.accept&&!this.isFileTypeValid(e)?(this.messages.push(this.invalidFileTypeMessage.replace("{0}",e.name).replace("{1}",this.accept)),!1):!(this.maxFileSize&&e.size>this.maxFileSize)||(this.messages.push(this.invalidFileSizeMessage.replace("{0}",e.name).replace("{1}",this.formatSize(this.maxFileSize))),!1)},isFileTypeValid(e){let l=this.accept.split(",").map((e=>e.trim()));for(let i of l){if(this.isWildcard(i)?this.getTypeClass(e.type)===this.getTypeClass(i):e.type==i||this.getFileExtension(e).toLowerCase()===i.toLowerCase())return!0}return!1},getTypeClass:e=>e.substring(0,e.indexOf("/")),isWildcard:e=>-1!==e.indexOf("*"),getFileExtension:e=>"."+e.name.split(".").pop(),isImage:e=>/^image\//.test(e.type),onDragEnter(e){this.disabled||(e.stopPropagation(),e.preventDefault())},onDragOver(e){this.disabled||(n.addClass(this.$refs.content,"p-fileupload-highlight"),e.stopPropagation(),e.preventDefault())},onDragLeave(){this.disabled||n.removeClass(this.$refs.content,"p-fileupload-highlight")},onDrop(e){if(!this.disabled){n.removeClass(this.$refs.content,"p-fileupload-highlight"),e.stopPropagation(),e.preventDefault();const l=e.dataTransfer?e.dataTransfer.files:e.target.files;(this.multiple||l&&1===l.length)&&this.onFileSelect(e)}},onBasicUploaderClick(){this.hasFiles?this.upload():this.$refs.fileInput.click()},remove(e){this.clearInputElement();let l=this.files.splice(e,1)[0];this.files=[...this.files],this.$emit("remove",{file:l,files:this.files})},removeUploadedFile(e){let l=this.uploadedFiles.splice(e,1)[0];this.uploadedFiles=[...this.uploadedFiles],this.$emit("remove-uploaded-file",{file:l,files:this.uploadedFiles})},clearInputElement(){this.$refs.fileInput.value=""},clearIEInput(){this.$refs.fileInput&&(this.duplicateIEEvent=!0,this.$refs.fileInput.value="")},formatSize(e){if(0===e)return"0 B";let l=Math.floor(Math.log(e)/Math.log(1e3));return parseFloat((e/Math.pow(1e3,l)).toFixed(3))+" "+["B","KB","MB","GB","TB","PB","EB","ZB","YB"][l]},isFileLimitExceeded(){return this.fileLimit&&this.fileLimit<=this.files.length+this.uploadedFileCount&&this.focused&&(this.focused=!1),this.fileLimit&&this.fileLimit<this.files.length+this.uploadedFileCount},checkFileLimit(){this.isFileLimitExceeded()&&this.messages.push(this.invalidFileLimitMessage.replace("{0}",this.fileLimit.toString()))},onMessageClose(){this.messages=null}},computed:{isAdvanced(){return"advanced"===this.mode},isBasic(){return"basic"===this.mode},advancedChooseButtonClass(){return["p-button p-component p-fileupload-choose",this.class,{"p-disabled":this.disabled,"p-focus":this.focused}]},basicChooseButtonClass(){return["p-button p-component p-fileupload-choose",this.class,{"p-fileupload-choose-selected":this.hasFiles,"p-disabled":this.disabled,"p-focus":this.focused}]},basicChooseButtonLabel(){return this.auto?this.chooseButtonLabel:this.hasFiles?this.files.map((e=>e.name)).join(", "):this.chooseButtonLabel},hasFiles(){return this.files&&this.files.length>0},hasUploadedFiles(){return this.uploadedFiles&&this.uploadedFiles.length>0},chooseDisabled(){return this.disabled||this.fileLimit&&this.fileLimit<=this.files.length+this.uploadedFileCount},uploadDisabled(){return this.disabled||!this.hasFiles||this.fileLimit&&this.fileLimit<this.files.length},cancelDisabled(){return this.disabled||!this.hasFiles},chooseButtonLabel(){return this.chooseLabel||this.$primevue.config.locale.choose},uploadButtonLabel(){return this.uploadLabel||this.$primevue.config.locale.upload},cancelButtonLabel(){return this.cancelLabel||this.$primevue.config.locale.cancel},completedLabel(){return this.$primevue.config.locale.completed},pendingLabel(){return this.$primevue.config.locale.pending}},components:{FileUploadButton:e,FileUploadProgressBar:o,FileUploadMessage:s,FileContent:$,PlusIcon:l,UploadIcon:t,TimesIcon:i},directives:{ripple:a}};const z={key:0,class:"p-fileupload p-fileupload-advanced p-component"},P=["multiple","accept","disabled"],W={class:"p-fileupload-buttonbar"},R={class:"p-button-label"},V={key:0,class:"p-fileupload-empty"},O={key:1,class:"p-fileupload p-fileupload-basic p-component"},N={class:"p-button-label"},A=["accept","disabled","multiple"];!function(e,l){void 0===l&&(l={});var i=l.insertAt;if(e&&"undefined"!=typeof document){var t=document.head||document.getElementsByTagName("head")[0],s=document.createElement("style");s.type="text/css","top"===i&&t.firstChild?t.insertBefore(s,t.firstChild):t.appendChild(s),s.styleSheet?s.styleSheet.cssText=e:s.appendChild(document.createTextNode(e))}}("\n.p-fileupload-content {\n    position: relative;\n}\n.p-fileupload-content .p-progressbar {\n    width: 100%;\n    position: absolute;\n    top: 0;\n    left: 0;\n}\n.p-button.p-fileupload-choose {\n    position: relative;\n    overflow: hidden;\n}\n.p-fileupload-buttonbar {\n    display: flex;\n    flex-wrap: wrap;\n}\n.p-fileupload > input[type='file'],\n.p-fileupload-basic input[type='file'] {\n    display: none;\n}\n.p-fluid .p-fileupload .p-button {\n    width: auto;\n}\n.p-fileupload-file {\n    display: flex;\n    flex-wrap: wrap;\n    align-items: center;\n}\n.p-fileupload-file-thumbnail {\n    flex-shrink: 0;\n}\n.p-fileupload-file-actions {\n    margin-left: auto;\n}\n"),T.render=function(e,l,i,t,s,o){const a=p("FileUploadButton"),n=p("FileUploadProgressBar"),d=p("FileUploadMessage"),$=p("FileContent"),x=B("ripple");return o.isAdvanced?(r(),u("div",z,[f("input",{ref:"fileInput",type:"file",onChange:l[0]||(l[0]=(...e)=>o.onFileSelect&&o.onFileSelect(...e)),multiple:i.multiple,accept:i.accept,disabled:o.chooseDisabled},null,40,P),f("div",W,[C(e.$slots,"header",{files:s.files,uploadedFiles:s.uploadedFiles,chooseCallback:o.choose,uploadCallback:o.upload,clearCallback:o.clear},(()=>[L((r(),u("span",{class:F(o.advancedChooseButtonClass),style:I(i.style),onClick:l[1]||(l[1]=(...e)=>o.choose&&o.choose(...e)),onKeydown:l[2]||(l[2]=S(((...e)=>o.choose&&o.choose(...e)),["enter"])),onFocus:l[3]||(l[3]=(...e)=>o.onFocus&&o.onFocus(...e)),onBlur:l[4]||(l[4]=(...e)=>o.onBlur&&o.onBlur(...e)),tabindex:"0"},[C(e.$slots,"chooseicon",{},(()=>[(r(),b(y(i.chooseIcon?"span":"PlusIcon"),{class:F(["p-button-icon p-button-icon-left",i.chooseIcon]),"aria-hidden":"true"},null,8,["class"]))])),f("span",R,m(o.chooseButtonLabel),1)],38)),[[x]]),i.showUploadButton?(r(),b(a,{key:0,label:o.uploadButtonLabel,onClick:o.upload,disabled:o.uploadDisabled},{icon:v((l=>[C(e.$slots,"uploadicon",{},(()=>[(r(),b(y(i.uploadIcon?"span":"UploadIcon"),{class:F([l.class,i.uploadIcon]),"aria-hidden":"true"},null,8,["class"]))]))])),_:3},8,["label","onClick","disabled"])):w("",!0),i.showCancelButton?(r(),b(a,{key:1,label:o.cancelButtonLabel,onClick:o.clear,disabled:o.cancelDisabled},{icon:v((l=>[C(e.$slots,"cancelicon",{},(()=>[(r(),b(y(i.cancelIcon?"span":"TimesIcon"),{class:F([l.class,i.cancelIcon]),"aria-hidden":"true"},null,8,["class"]))]))])),_:3},8,["label","onClick","disabled"])):w("",!0)]))]),f("div",{ref:"content",class:"p-fileupload-content",onDragenter:l[5]||(l[5]=(...e)=>o.onDragEnter&&o.onDragEnter(...e)),onDragover:l[6]||(l[6]=(...e)=>o.onDragOver&&o.onDragOver(...e)),onDragleave:l[7]||(l[7]=(...e)=>o.onDragLeave&&o.onDragLeave(...e)),onDrop:l[8]||(l[8]=(...e)=>o.onDrop&&o.onDrop(...e))},[C(e.$slots,"content",{files:s.files,uploadedFiles:s.uploadedFiles,removeUploadedFileCallback:o.removeUploadedFile,removeFileCallback:o.remove,progress:s.progress,messages:s.messages},(()=>[o.hasFiles?(r(),b(n,{key:0,value:s.progress,showValue:!1},null,8,["value"])):w("",!0),(r(!0),u(c,null,h(s.messages,(e=>(r(),b(d,{key:e,severity:"error",onClose:o.onMessageClose},{default:v((()=>[k(m(e),1)])),_:2},1032,["onClose"])))),128)),o.hasFiles?(r(),b($,{key:1,files:s.files,onRemove:o.remove,badgeValue:o.pendingLabel,previewWidth:i.previewWidth,templates:e.$slots},null,8,["files","onRemove","badgeValue","previewWidth","templates"])):w("",!0),g($,{files:s.uploadedFiles,onRemove:o.removeUploadedFile,badgeValue:o.completedLabel,badgeSeverity:"success",previewWidth:i.previewWidth,templates:e.$slots},null,8,["files","onRemove","badgeValue","previewWidth","templates"])])),!e.$slots.empty||o.hasFiles||o.hasUploadedFiles?w("",!0):(r(),u("div",V,[C(e.$slots,"empty")]))],544)])):o.isBasic?(r(),u("div",O,[(r(!0),u(c,null,h(s.messages,(e=>(r(),b(d,{key:e,severity:"error",onClose:o.onMessageClose},{default:v((()=>[k(m(e),1)])),_:2},1032,["onClose"])))),128)),L((r(),u("span",{class:F(o.basicChooseButtonClass),style:I(i.style),onMouseup:l[12]||(l[12]=(...e)=>o.onBasicUploaderClick&&o.onBasicUploaderClick(...e)),onKeydown:l[13]||(l[13]=S(((...e)=>o.choose&&o.choose(...e)),["enter"])),onFocus:l[14]||(l[14]=(...e)=>o.onFocus&&o.onFocus(...e)),onBlur:l[15]||(l[15]=(...e)=>o.onBlur&&o.onBlur(...e)),tabindex:"0"},[!o.hasFiles||i.auto?C(e.$slots,"uploadicon",{key:0},(()=>[(r(),b(y(i.uploadIcon?"span":"UploadIcon"),{class:F(["p-button-icon p-button-icon-left",i.uploadIcon]),"aria-hidden":"true"},null,8,["class"]))])):C(e.$slots,"chooseicon",{key:1},(()=>[(r(),b(y(i.chooseIcon?"span":"PlusIcon"),{class:F(["p-button-icon p-button-icon-left",i.chooseIcon]),"aria-hidden":"true"},null,8,["class"]))])),f("span",N,m(o.basicChooseButtonLabel),1),o.hasFiles?w("",!0):(r(),u("input",{key:2,ref:"fileInput",type:"file",accept:i.accept,disabled:i.disabled,multiple:i.multiple,onChange:l[9]||(l[9]=(...e)=>o.onFileSelect&&o.onFileSelect(...e)),onFocus:l[10]||(l[10]=(...e)=>o.onFocus&&o.onFocus(...e)),onBlur:l[11]||(l[11]=(...e)=>o.onBlur&&o.onBlur(...e))},null,40,A))],38)),[[x]])])):w("",!0)};export{T as default};

package/fileupload/fileupload.js

@@ -1,10 +1,13 @@
 this.primevue = this.primevue || {};
-this.primevue.fileupload = (function (Button, Message, ProgressBar, Ripple, utils, Badge, vue) {
+this.primevue.fileupload = (function (Button, PlusIcon, TimesIcon, UploadIcon, Message, ProgressBar, Ripple, utils, Badge, vue) {
     'use strict';
 
     function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
     var Button__default = /*#__PURE__*/_interopDefaultLegacy(Button);
+    var PlusIcon__default = /*#__PURE__*/_interopDefaultLegacy(PlusIcon);
+    var TimesIcon__default = /*#__PURE__*/_interopDefaultLegacy(TimesIcon);
+    var UploadIcon__default = /*#__PURE__*/_interopDefaultLegacy(UploadIcon);
     var Message__default = /*#__PURE__*/_interopDefaultLegacy(Message);
     var ProgressBar__default = /*#__PURE__*/_interopDefaultLegacy(ProgressBar);
     var Ripple__default = /*#__PURE__*/_interopDefaultLegacy(Ripple);
@@ -28,6 +31,10 @@ this.primevue.fileupload = (function (Button, Message, ProgressBar, Ripple, util
             previewWidth: {
                 type: Number,
                 default: 50
+            },
+            templates: {
+                type: null,
+                default: null
             }
         },
         methods: {
@@ -46,7 +53,8 @@ this.primevue.fileupload = (function (Button, Message, ProgressBar, Ripple, util
         },
         components: {
             FileUploadButton: Button__default["default"],
-            FileUploadBadge: Badge__default["default"]
+            FileUploadBadge: Badge__default["default"],
+            TimesIcon: TimesIcon__default["default"]
         }
     };
 
@@ -58,6 +66,7 @@ this.primevue.fileupload = (function (Button, Message, ProgressBar, Ripple, util
 
     function render$1(_ctx, _cache, $props, $setup, $data, $options) {
       const _component_FileUploadBadge = vue.resolveComponent("FileUploadBadge");
+      const _component_TimesIcon = vue.resolveComponent("TimesIcon");
       const _component_FileUploadButton = vue.resolveComponent("FileUploadButton");
 
       return (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($props.files, (file, index) => {
@@ -83,10 +92,28 @@ this.primevue.fileupload = (function (Button, Message, ProgressBar, Ripple, util
           ]),
           vue.createElementVNode("div", _hoisted_5$1, [
             vue.createVNode(_component_FileUploadButton, {
-              icon: "pi pi-times",
               onClick: $event => (_ctx.$emit('remove', index)),
-              class: "p-fileupload-file-remove p-button-text p-button-danger p-button-rounded"
-            }, null, 8, ["onClick"])
+              text: "",
+              rounded: "",
+              severity: "danger",
+              class: "p-fileupload-file-remove"
+            }, {
+              icon: vue.withCtx((iconProps) => [
+                ($props.templates.fileremoveicon)
+                  ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.templates.fileremoveicon), {
+                      key: 0,
+                      class: vue.normalizeClass(iconProps.class),
+                      file: file,
+                      index: index
+                    }, null, 8, ["class", "file", "index"]))
+                  : (vue.openBlock(), vue.createBlock(_component_TimesIcon, {
+                      key: 1,
+                      class: vue.normalizeClass(iconProps.class),
+                      "aria-hidden": "true"
+                    }, null, 8, ["class"]))
+              ]),
+              _: 2
+            }, 1032, ["onClick"])
           ])
         ]))
       }), 128))
@@ -180,15 +207,15 @@ this.primevue.fileupload = (function (Button, Message, ProgressBar, Ripple, util
             },
             chooseIcon: {
                 type: String,
-                default: 'pi pi-plus'
+                default: undefined
             },
             uploadIcon: {
                 type: String,
-                default: 'pi pi-upload'
+                default: undefined
             },
             cancelIcon: {
                 type: String,
-                default: 'pi pi-times'
+                default: undefined
             },
             style: null,
             class: null
@@ -503,12 +530,6 @@ this.primevue.fileupload = (function (Button, Message, ProgressBar, Ripple, util
                     }
                 ];
             },
-            advancedChooseIconClass() {
-                return ['p-button-icon p-button-icon-left pi-fw', this.chooseIcon];
-            },
-            basicChooseButtonIconClass() {
-                return ['p-button-icon p-button-icon-left', !this.hasFiles || this.auto ? this.uploadIcon : this.chooseIcon];
-            },
             basicChooseButtonLabel() {
                 return this.auto ? this.chooseButtonLabel : this.hasFiles ? this.files.map((f) => f.name).join(', ') : this.chooseButtonLabel;
             },
@@ -547,7 +568,10 @@ this.primevue.fileupload = (function (Button, Message, ProgressBar, Ripple, util
             FileUploadButton: Button__default["default"],
             FileUploadProgressBar: ProgressBar__default["default"],
             FileUploadMessage: Message__default["default"],
-            FileContent: script$1
+            FileContent: script$1,
+            PlusIcon: PlusIcon__default["default"],
+            UploadIcon: UploadIcon__default["default"],
+            TimesIcon: TimesIcon__default["default"]
         },
         directives: {
             ripple: Ripple__default["default"]
@@ -606,9 +630,12 @@ this.primevue.fileupload = (function (Button, Message, ProgressBar, Ripple, util
                   onBlur: _cache[4] || (_cache[4] = (...args) => ($options.onBlur && $options.onBlur(...args))),
                   tabindex: "0"
                 }, [
-                  vue.createElementVNode("span", {
-                    class: vue.normalizeClass($options.advancedChooseIconClass)
-                  }, null, 2),
+                  vue.renderSlot(_ctx.$slots, "chooseicon", {}, () => [
+                    (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.chooseIcon ? 'span' : 'PlusIcon'), {
+                      class: vue.normalizeClass(['p-button-icon p-button-icon-left', $props.chooseIcon]),
+                      "aria-hidden": "true"
+                    }, null, 8, ["class"]))
+                  ]),
                   vue.createElementVNode("span", _hoisted_4, vue.toDisplayString($options.chooseButtonLabel), 1)
                 ], 38)), [
                   [_directive_ripple]
@@ -617,19 +644,37 @@ this.primevue.fileupload = (function (Button, Message, ProgressBar, Ripple, util
                   ? (vue.openBlock(), vue.createBlock(_component_FileUploadButton, {
                       key: 0,
                       label: $options.uploadButtonLabel,
-                      icon: $props.uploadIcon,
                       onClick: $options.upload,
                       disabled: $options.uploadDisabled
-                    }, null, 8, ["label", "icon", "onClick", "disabled"]))
+                    }, {
+                      icon: vue.withCtx((iconProps) => [
+                        vue.renderSlot(_ctx.$slots, "uploadicon", {}, () => [
+                          (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.uploadIcon ? 'span' : 'UploadIcon'), {
+                            class: vue.normalizeClass([iconProps.class, $props.uploadIcon]),
+                            "aria-hidden": "true"
+                          }, null, 8, ["class"]))
+                        ])
+                      ]),
+                      _: 3
+                    }, 8, ["label", "onClick", "disabled"]))
                   : vue.createCommentVNode("", true),
                 ($props.showCancelButton)
                   ? (vue.openBlock(), vue.createBlock(_component_FileUploadButton, {
                       key: 1,
                       label: $options.cancelButtonLabel,
-                      icon: $props.cancelIcon,
                       onClick: $options.clear,
                       disabled: $options.cancelDisabled
-                    }, null, 8, ["label", "icon", "onClick", "disabled"]))
+                    }, {
+                      icon: vue.withCtx((iconProps) => [
+                        vue.renderSlot(_ctx.$slots, "cancelicon", {}, () => [
+                          (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.cancelIcon ? 'span' : 'TimesIcon'), {
+                            class: vue.normalizeClass([iconProps.class, $props.cancelIcon]),
+                            "aria-hidden": "true"
+                          }, null, 8, ["class"]))
+                        ])
+                      ]),
+                      _: 3
+                    }, 8, ["label", "onClick", "disabled"]))
                   : vue.createCommentVNode("", true)
               ])
             ]),
@@ -674,16 +719,18 @@ this.primevue.fileupload = (function (Button, Message, ProgressBar, Ripple, util
                       files: $data.files,
                       onRemove: $options.remove,
                       badgeValue: $options.pendingLabel,
-                      previewWidth: $props.previewWidth
-                    }, null, 8, ["files", "onRemove", "badgeValue", "previewWidth"]))
+                      previewWidth: $props.previewWidth,
+                      templates: _ctx.$slots
+                    }, null, 8, ["files", "onRemove", "badgeValue", "previewWidth", "templates"]))
                   : vue.createCommentVNode("", true),
                 vue.createVNode(_component_FileContent, {
                   files: $data.uploadedFiles,
                   onRemove: $options.removeUploadedFile,
                   badgeValue: $options.completedLabel,
                   badgeSeverity: "success",
-                  previewWidth: $props.previewWidth
-                }, null, 8, ["files", "onRemove", "badgeValue", "previewWidth"])
+                  previewWidth: $props.previewWidth,
+                  templates: _ctx.$slots
+                }, null, 8, ["files", "onRemove", "badgeValue", "previewWidth", "templates"])
               ]),
               (_ctx.$slots.empty && !$options.hasFiles && !$options.hasUploadedFiles)
                 ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_5, [
@@ -715,13 +762,23 @@ this.primevue.fileupload = (function (Button, Message, ProgressBar, Ripple, util
                 onBlur: _cache[15] || (_cache[15] = (...args) => ($options.onBlur && $options.onBlur(...args))),
                 tabindex: "0"
               }, [
-                vue.createElementVNode("span", {
-                  class: vue.normalizeClass($options.basicChooseButtonIconClass)
-                }, null, 2),
+                (!$options.hasFiles || $props.auto)
+                  ? vue.renderSlot(_ctx.$slots, "uploadicon", { key: 0 }, () => [
+                      (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.uploadIcon ? 'span' : 'UploadIcon'), {
+                        class: vue.normalizeClass(['p-button-icon p-button-icon-left', $props.uploadIcon]),
+                        "aria-hidden": "true"
+                      }, null, 8, ["class"]))
+                    ])
+                  : vue.renderSlot(_ctx.$slots, "chooseicon", { key: 1 }, () => [
+                      (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.chooseIcon ? 'span' : 'PlusIcon'), {
+                        class: vue.normalizeClass(['p-button-icon p-button-icon-left', $props.chooseIcon]),
+                        "aria-hidden": "true"
+                      }, null, 8, ["class"]))
+                    ]),
                 vue.createElementVNode("span", _hoisted_7, vue.toDisplayString($options.basicChooseButtonLabel), 1),
                 (!$options.hasFiles)
                   ? (vue.openBlock(), vue.createElementBlock("input", {
-                      key: 0,
+                      key: 2,
                       ref: "fileInput",
                       type: "file",
                       accept: $props.accept,
@@ -773,4 +830,4 @@ this.primevue.fileupload = (function (Button, Message, ProgressBar, Ripple, util
 
     return script;
 
-})(primevue.button, primevue.message, primevue.progressbar, primevue.ripple, primevue.utils, primevue.badge, Vue);
+})(primevue.button, primevue.icons.plus, primevue.icons.times, primevue.icons.upload, primevue.message, primevue.progressbar, primevue.ripple, primevue.utils, primevue.badge, Vue);

package/fileupload/fileupload.min.js

@@ -1 +1 @@
-this.primevue=this.primevue||{},this.primevue.fileupload=function(e,t,l,i,s,o,a){"use strict";function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r=n(e),d=n(t),p=n(l),u=n(i),c=n(o),h={emits:["remove"],props:{files:{type:Array,default:()=>[]},badgeSeverity:{type:String,default:"warning"},badgeValue:{type:String,default:null},previewWidth:{type:Number,default:50}},methods:{formatSize(e){if(0===e)return"0 B";let t=Math.floor(Math.log(e)/Math.log(1e3));return parseFloat((e/Math.pow(1e3,t)).toFixed(3))+" "+["B","KB","MB","GB","TB","PB","EB","ZB","YB"][t]}},components:{FileUploadButton:r.default,FileUploadBadge:c.default}};const f=["alt","src","width"],m={class:"p-fileupload-file-details"},g={class:"p-fileupload-file-name"},v={class:"p-fileupload-file-size"},b={class:"p-fileupload-file-actions"};h.render=function(e,t,l,i,s,o){const n=a.resolveComponent("FileUploadBadge"),r=a.resolveComponent("FileUploadButton");return a.openBlock(!0),a.createElementBlock(a.Fragment,null,a.renderList(l.files,((t,i)=>(a.openBlock(),a.createElementBlock("div",{key:t.name+t.type+t.size,class:"p-fileupload-file"},[a.createElementVNode("img",{role:"presentation",class:"p-fileupload-file-thumbnail",alt:t.name,src:t.objectURL,width:l.previewWidth},null,8,f),a.createElementVNode("div",m,[a.createElementVNode("div",g,a.toDisplayString(t.name),1),a.createElementVNode("span",v,a.toDisplayString(o.formatSize(t.size)),1),a.createVNode(n,{value:l.badgeValue,class:"p-fileupload-file-badge",severity:l.badgeSeverity},null,8,["value","severity"])]),a.createElementVNode("div",b,[a.createVNode(r,{icon:"pi pi-times",onClick:t=>e.$emit("remove",i),class:"p-fileupload-file-remove p-button-text p-button-danger p-button-rounded"},null,8,["onClick"])])])))),128)};var B={name:"FileUpload",emits:["select","uploader","before-upload","progress","upload","error","before-send","clear","remove","remove-uploaded-file"],props:{name:{type:String,default:null},url:{type:String,default:null},mode:{type:String,default:"advanced"},multiple:{type:Boolean,default:!1},accept:{type:String,default:null},disabled:{type:Boolean,default:!1},auto:{type:Boolean,default:!1},maxFileSize:{type:Number,default:null},invalidFileSizeMessage:{type:String,default:"{0}: Invalid file size, file size should be smaller than {1}."},invalidFileTypeMessage:{type:String,default:"{0}: Invalid file type, allowed file types: {1}."},fileLimit:{type:Number,default:null},invalidFileLimitMessage:{type:String,default:"Maximum number of files exceeded, limit is {0} at most."},withCredentials:{type:Boolean,default:!1},previewWidth:{type:Number,default:50},chooseLabel:{type:String,default:null},uploadLabel:{type:String,default:null},cancelLabel:{type:String,default:null},customUpload:{type:Boolean,default:!1},showUploadButton:{type:Boolean,default:!0},showCancelButton:{type:Boolean,default:!0},chooseIcon:{type:String,default:"pi pi-plus"},uploadIcon:{type:String,default:"pi pi-upload"},cancelIcon:{type:String,default:"pi pi-times"},style:null,class:null},duplicateIEEvent:!1,data:()=>({uploadedFileCount:0,files:[],messages:[],focused:!1,progress:null,uploadedFiles:[]}),methods:{onFileSelect(e){if("drop"!==e.type&&this.isIE11()&&this.duplicateIEEvent)return void(this.duplicateIEEvent=!1);this.messages=[],this.files=this.files||[];let t=e.dataTransfer?e.dataTransfer.files:e.target.files;for(let e of t)this.isFileSelected(e)||this.validate(e)&&(this.isImage(e)&&(e.objectURL=window.URL.createObjectURL(e)),this.files.push(e));this.$emit("select",{originalEvent:e,files:this.files}),this.fileLimit&&this.checkFileLimit(),this.auto&&this.hasFiles&&!this.isFileLimitExceeded()&&this.upload(),"drop"!==e.type&&this.isIE11()?this.clearIEInput():this.clearInputElement()},choose(){this.$refs.fileInput.click()},upload(){if(this.customUpload)this.fileLimit&&(this.uploadedFileCount+=this.files.length),this.$emit("uploader",{files:this.files}),this.clear();else{let e=new XMLHttpRequest,t=new FormData;this.$emit("before-upload",{xhr:e,formData:t});for(let e of this.files)t.append(this.name,e,e.name);e.upload.addEventListener("progress",(e=>{e.lengthComputable&&(this.progress=Math.round(100*e.loaded/e.total)),this.$emit("progress",{originalEvent:e,progress:this.progress})})),e.onreadystatechange=()=>{4===e.readyState&&(this.progress=0,e.status>=200&&e.status<300?(this.fileLimit&&(this.uploadedFileCount+=this.files.length),this.$emit("upload",{xhr:e,files:this.files})):this.$emit("error",{xhr:e,files:this.files}),this.uploadedFiles.push(...this.files),this.clear())},e.open("POST",this.url,!0),this.$emit("before-send",{xhr:e,formData:t}),e.withCredentials=this.withCredentials,e.send(t)}},clear(){this.files=[],this.messages=null,this.$emit("clear"),this.isAdvanced&&this.clearInputElement()},onFocus(){this.focused=!0},onBlur(){this.focused=!1},isFileSelected(e){if(this.files&&this.files.length)for(let t of this.files)if(t.name+t.type+t.size===e.name+e.type+e.size)return!0;return!1},isIE11:()=>!!window.MSInputMethodContext&&!!document.documentMode,validate(e){return this.accept&&!this.isFileTypeValid(e)?(this.messages.push(this.invalidFileTypeMessage.replace("{0}",e.name).replace("{1}",this.accept)),!1):!(this.maxFileSize&&e.size>this.maxFileSize)||(this.messages.push(this.invalidFileSizeMessage.replace("{0}",e.name).replace("{1}",this.formatSize(this.maxFileSize))),!1)},isFileTypeValid(e){let t=this.accept.split(",").map((e=>e.trim()));for(let l of t){if(this.isWildcard(l)?this.getTypeClass(e.type)===this.getTypeClass(l):e.type==l||this.getFileExtension(e).toLowerCase()===l.toLowerCase())return!0}return!1},getTypeClass:e=>e.substring(0,e.indexOf("/")),isWildcard:e=>-1!==e.indexOf("*"),getFileExtension:e=>"."+e.name.split(".").pop(),isImage:e=>/^image\//.test(e.type),onDragEnter(e){this.disabled||(e.stopPropagation(),e.preventDefault())},onDragOver(e){this.disabled||(s.DomHandler.addClass(this.$refs.content,"p-fileupload-highlight"),e.stopPropagation(),e.preventDefault())},onDragLeave(){this.disabled||s.DomHandler.removeClass(this.$refs.content,"p-fileupload-highlight")},onDrop(e){if(!this.disabled){s.DomHandler.removeClass(this.$refs.content,"p-fileupload-highlight"),e.stopPropagation(),e.preventDefault();const t=e.dataTransfer?e.dataTransfer.files:e.target.files;(this.multiple||t&&1===t.length)&&this.onFileSelect(e)}},onBasicUploaderClick(){this.hasFiles?this.upload():this.$refs.fileInput.click()},remove(e){this.clearInputElement();let t=this.files.splice(e,1)[0];this.files=[...this.files],this.$emit("remove",{file:t,files:this.files})},removeUploadedFile(e){let t=this.uploadedFiles.splice(e,1)[0];this.uploadedFiles=[...this.uploadedFiles],this.$emit("remove-uploaded-file",{file:t,files:this.uploadedFiles})},clearInputElement(){this.$refs.fileInput.value=""},clearIEInput(){this.$refs.fileInput&&(this.duplicateIEEvent=!0,this.$refs.fileInput.value="")},formatSize(e){if(0===e)return"0 B";let t=Math.floor(Math.log(e)/Math.log(1e3));return parseFloat((e/Math.pow(1e3,t)).toFixed(3))+" "+["B","KB","MB","GB","TB","PB","EB","ZB","YB"][t]},isFileLimitExceeded(){return this.fileLimit&&this.fileLimit<=this.files.length+this.uploadedFileCount&&this.focused&&(this.focused=!1),this.fileLimit&&this.fileLimit<this.files.length+this.uploadedFileCount},checkFileLimit(){this.isFileLimitExceeded()&&this.messages.push(this.invalidFileLimitMessage.replace("{0}",this.fileLimit.toString()))},onMessageClose(){this.messages=null}},computed:{isAdvanced(){return"advanced"===this.mode},isBasic(){return"basic"===this.mode},advancedChooseButtonClass(){return["p-button p-component p-fileupload-choose",this.class,{"p-disabled":this.disabled,"p-focus":this.focused}]},basicChooseButtonClass(){return["p-button p-component p-fileupload-choose",this.class,{"p-fileupload-choose-selected":this.hasFiles,"p-disabled":this.disabled,"p-focus":this.focused}]},advancedChooseIconClass(){return["p-button-icon p-button-icon-left pi-fw",this.chooseIcon]},basicChooseButtonIconClass(){return["p-button-icon p-button-icon-left",!this.hasFiles||this.auto?this.uploadIcon:this.chooseIcon]},basicChooseButtonLabel(){return this.auto?this.chooseButtonLabel:this.hasFiles?this.files.map((e=>e.name)).join(", "):this.chooseButtonLabel},hasFiles(){return this.files&&this.files.length>0},hasUploadedFiles(){return this.uploadedFiles&&this.uploadedFiles.length>0},chooseDisabled(){return this.disabled||this.fileLimit&&this.fileLimit<=this.files.length+this.uploadedFileCount},uploadDisabled(){return this.disabled||!this.hasFiles||this.fileLimit&&this.fileLimit<this.files.length},cancelDisabled(){return this.disabled||!this.hasFiles},chooseButtonLabel(){return this.chooseLabel||this.$primevue.config.locale.choose},uploadButtonLabel(){return this.uploadLabel||this.$primevue.config.locale.upload},cancelButtonLabel(){return this.cancelLabel||this.$primevue.config.locale.cancel},completedLabel(){return this.$primevue.config.locale.completed},pendingLabel(){return this.$primevue.config.locale.pending}},components:{FileUploadButton:r.default,FileUploadProgressBar:p.default,FileUploadMessage:d.default,FileContent:h},directives:{ripple:u.default}};const y={key:0,class:"p-fileupload p-fileupload-advanced p-component"},F=["multiple","accept","disabled"],C={class:"p-fileupload-buttonbar"},k={class:"p-button-label"},E={key:0,class:"p-fileupload-empty"},L={key:1,class:"p-fileupload p-fileupload-basic p-component"},S={class:"p-button-label"},w=["accept","disabled","multiple"];return function(e,t){void 0===t&&(t={});var l=t.insertAt;if(e&&"undefined"!=typeof document){var i=document.head||document.getElementsByTagName("head")[0],s=document.createElement("style");s.type="text/css","top"===l&&i.firstChild?i.insertBefore(s,i.firstChild):i.appendChild(s),s.styleSheet?s.styleSheet.cssText=e:s.appendChild(document.createTextNode(e))}}("\n.p-fileupload-content {\n    position: relative;\n}\n.p-fileupload-content .p-progressbar {\n    width: 100%;\n    position: absolute;\n    top: 0;\n    left: 0;\n}\n.p-button.p-fileupload-choose {\n    position: relative;\n    overflow: hidden;\n}\n.p-fileupload-buttonbar {\n    display: flex;\n    flex-wrap: wrap;\n}\n.p-fileupload > input[type='file'],\n.p-fileupload-basic input[type='file'] {\n    display: none;\n}\n.p-fluid .p-fileupload .p-button {\n    width: auto;\n}\n.p-fileupload-file {\n    display: flex;\n    flex-wrap: wrap;\n    align-items: center;\n}\n.p-fileupload-file-thumbnail {\n    flex-shrink: 0;\n}\n.p-fileupload-file-actions {\n    margin-left: auto;\n}\n"),B.render=function(e,t,l,i,s,o){const n=a.resolveComponent("FileUploadButton"),r=a.resolveComponent("FileUploadProgressBar"),d=a.resolveComponent("FileUploadMessage"),p=a.resolveComponent("FileContent"),u=a.resolveDirective("ripple");return o.isAdvanced?(a.openBlock(),a.createElementBlock("div",y,[a.createElementVNode("input",{ref:"fileInput",type:"file",onChange:t[0]||(t[0]=(...e)=>o.onFileSelect&&o.onFileSelect(...e)),multiple:l.multiple,accept:l.accept,disabled:o.chooseDisabled},null,40,F),a.createElementVNode("div",C,[a.renderSlot(e.$slots,"header",{files:s.files,uploadedFiles:s.uploadedFiles,chooseCallback:o.choose,uploadCallback:o.upload,clearCallback:o.clear},(()=>[a.withDirectives((a.openBlock(),a.createElementBlock("span",{class:a.normalizeClass(o.advancedChooseButtonClass),style:a.normalizeStyle(l.style),onClick:t[1]||(t[1]=(...e)=>o.choose&&o.choose(...e)),onKeydown:t[2]||(t[2]=a.withKeys(((...e)=>o.choose&&o.choose(...e)),["enter"])),onFocus:t[3]||(t[3]=(...e)=>o.onFocus&&o.onFocus(...e)),onBlur:t[4]||(t[4]=(...e)=>o.onBlur&&o.onBlur(...e)),tabindex:"0"},[a.createElementVNode("span",{class:a.normalizeClass(o.advancedChooseIconClass)},null,2),a.createElementVNode("span",k,a.toDisplayString(o.chooseButtonLabel),1)],38)),[[u]]),l.showUploadButton?(a.openBlock(),a.createBlock(n,{key:0,label:o.uploadButtonLabel,icon:l.uploadIcon,onClick:o.upload,disabled:o.uploadDisabled},null,8,["label","icon","onClick","disabled"])):a.createCommentVNode("",!0),l.showCancelButton?(a.openBlock(),a.createBlock(n,{key:1,label:o.cancelButtonLabel,icon:l.cancelIcon,onClick:o.clear,disabled:o.cancelDisabled},null,8,["label","icon","onClick","disabled"])):a.createCommentVNode("",!0)]))]),a.createElementVNode("div",{ref:"content",class:"p-fileupload-content",onDragenter:t[5]||(t[5]=(...e)=>o.onDragEnter&&o.onDragEnter(...e)),onDragover:t[6]||(t[6]=(...e)=>o.onDragOver&&o.onDragOver(...e)),onDragleave:t[7]||(t[7]=(...e)=>o.onDragLeave&&o.onDragLeave(...e)),onDrop:t[8]||(t[8]=(...e)=>o.onDrop&&o.onDrop(...e))},[a.renderSlot(e.$slots,"content",{files:s.files,uploadedFiles:s.uploadedFiles,removeUploadedFileCallback:o.removeUploadedFile,removeFileCallback:o.remove,progress:s.progress,messages:s.messages},(()=>[o.hasFiles?(a.openBlock(),a.createBlock(r,{key:0,value:s.progress,showValue:!1},null,8,["value"])):a.createCommentVNode("",!0),(a.openBlock(!0),a.createElementBlock(a.Fragment,null,a.renderList(s.messages,(e=>(a.openBlock(),a.createBlock(d,{key:e,severity:"error",onClose:o.onMessageClose},{default:a.withCtx((()=>[a.createTextVNode(a.toDisplayString(e),1)])),_:2},1032,["onClose"])))),128)),o.hasFiles?(a.openBlock(),a.createBlock(p,{key:1,files:s.files,onRemove:o.remove,badgeValue:o.pendingLabel,previewWidth:l.previewWidth},null,8,["files","onRemove","badgeValue","previewWidth"])):a.createCommentVNode("",!0),a.createVNode(p,{files:s.uploadedFiles,onRemove:o.removeUploadedFile,badgeValue:o.completedLabel,badgeSeverity:"success",previewWidth:l.previewWidth},null,8,["files","onRemove","badgeValue","previewWidth"])])),!e.$slots.empty||o.hasFiles||o.hasUploadedFiles?a.createCommentVNode("",!0):(a.openBlock(),a.createElementBlock("div",E,[a.renderSlot(e.$slots,"empty")]))],544)])):o.isBasic?(a.openBlock(),a.createElementBlock("div",L,[(a.openBlock(!0),a.createElementBlock(a.Fragment,null,a.renderList(s.messages,(e=>(a.openBlock(),a.createBlock(d,{key:e,severity:"error",onClose:o.onMessageClose},{default:a.withCtx((()=>[a.createTextVNode(a.toDisplayString(e),1)])),_:2},1032,["onClose"])))),128)),a.withDirectives((a.openBlock(),a.createElementBlock("span",{class:a.normalizeClass(o.basicChooseButtonClass),style:a.normalizeStyle(l.style),onMouseup:t[12]||(t[12]=(...e)=>o.onBasicUploaderClick&&o.onBasicUploaderClick(...e)),onKeydown:t[13]||(t[13]=a.withKeys(((...e)=>o.choose&&o.choose(...e)),["enter"])),onFocus:t[14]||(t[14]=(...e)=>o.onFocus&&o.onFocus(...e)),onBlur:t[15]||(t[15]=(...e)=>o.onBlur&&o.onBlur(...e)),tabindex:"0"},[a.createElementVNode("span",{class:a.normalizeClass(o.basicChooseButtonIconClass)},null,2),a.createElementVNode("span",S,a.toDisplayString(o.basicChooseButtonLabel),1),o.hasFiles?a.createCommentVNode("",!0):(a.openBlock(),a.createElementBlock("input",{key:0,ref:"fileInput",type:"file",accept:l.accept,disabled:l.disabled,multiple:l.multiple,onChange:t[9]||(t[9]=(...e)=>o.onFileSelect&&o.onFileSelect(...e)),onFocus:t[10]||(t[10]=(...e)=>o.onFocus&&o.onFocus(...e)),onBlur:t[11]||(t[11]=(...e)=>o.onBlur&&o.onBlur(...e))},null,40,w))],38)),[[u]])])):a.createCommentVNode("",!0)},B}(primevue.button,primevue.message,primevue.progressbar,primevue.ripple,primevue.utils,primevue.badge,Vue);
+this.primevue=this.primevue||{},this.primevue.fileupload=function(e,l,t,i,s,o,a,n,r,d){"use strict";function p(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c=p(e),u=p(l),h=p(t),f=p(i),m=p(s),g=p(o),v=p(a),b=p(r),B={emits:["remove"],props:{files:{type:Array,default:()=>[]},badgeSeverity:{type:String,default:"warning"},badgeValue:{type:String,default:null},previewWidth:{type:Number,default:50},templates:{type:null,default:null}},methods:{formatSize(e){if(0===e)return"0 B";let l=Math.floor(Math.log(e)/Math.log(1e3));return parseFloat((e/Math.pow(1e3,l)).toFixed(3))+" "+["B","KB","MB","GB","TB","PB","EB","ZB","YB"][l]}},components:{FileUploadButton:c.default,FileUploadBadge:b.default,TimesIcon:h.default}};const y=["alt","src","width"],F={class:"p-fileupload-file-details"},C={class:"p-fileupload-file-name"},k={class:"p-fileupload-file-size"},S={class:"p-fileupload-file-actions"};B.render=function(e,l,t,i,s,o){const a=d.resolveComponent("FileUploadBadge"),n=d.resolveComponent("TimesIcon"),r=d.resolveComponent("FileUploadButton");return d.openBlock(!0),d.createElementBlock(d.Fragment,null,d.renderList(t.files,((l,i)=>(d.openBlock(),d.createElementBlock("div",{key:l.name+l.type+l.size,class:"p-fileupload-file"},[d.createElementVNode("img",{role:"presentation",class:"p-fileupload-file-thumbnail",alt:l.name,src:l.objectURL,width:t.previewWidth},null,8,y),d.createElementVNode("div",F,[d.createElementVNode("div",C,d.toDisplayString(l.name),1),d.createElementVNode("span",k,d.toDisplayString(o.formatSize(l.size)),1),d.createVNode(a,{value:t.badgeValue,class:"p-fileupload-file-badge",severity:t.badgeSeverity},null,8,["value","severity"])]),d.createElementVNode("div",S,[d.createVNode(r,{onClick:l=>e.$emit("remove",i),text:"",rounded:"",severity:"danger",class:"p-fileupload-file-remove"},{icon:d.withCtx((e=>[t.templates.fileremoveicon?(d.openBlock(),d.createBlock(d.resolveDynamicComponent(t.templates.fileremoveicon),{key:0,class:d.normalizeClass(e.class),file:l,index:i},null,8,["class","file","index"])):(d.openBlock(),d.createBlock(n,{key:1,class:d.normalizeClass(e.class),"aria-hidden":"true"},null,8,["class"]))])),_:2},1032,["onClick"])])])))),128)};var L={name:"FileUpload",emits:["select","uploader","before-upload","progress","upload","error","before-send","clear","remove","remove-uploaded-file"],props:{name:{type:String,default:null},url:{type:String,default:null},mode:{type:String,default:"advanced"},multiple:{type:Boolean,default:!1},accept:{type:String,default:null},disabled:{type:Boolean,default:!1},auto:{type:Boolean,default:!1},maxFileSize:{type:Number,default:null},invalidFileSizeMessage:{type:String,default:"{0}: Invalid file size, file size should be smaller than {1}."},invalidFileTypeMessage:{type:String,default:"{0}: Invalid file type, allowed file types: {1}."},fileLimit:{type:Number,default:null},invalidFileLimitMessage:{type:String,default:"Maximum number of files exceeded, limit is {0} at most."},withCredentials:{type:Boolean,default:!1},previewWidth:{type:Number,default:50},chooseLabel:{type:String,default:null},uploadLabel:{type:String,default:null},cancelLabel:{type:String,default:null},customUpload:{type:Boolean,default:!1},showUploadButton:{type:Boolean,default:!0},showCancelButton:{type:Boolean,default:!0},chooseIcon:{type:String,default:void 0},uploadIcon:{type:String,default:void 0},cancelIcon:{type:String,default:void 0},style:null,class:null},duplicateIEEvent:!1,data:()=>({uploadedFileCount:0,files:[],messages:[],focused:!1,progress:null,uploadedFiles:[]}),methods:{onFileSelect(e){if("drop"!==e.type&&this.isIE11()&&this.duplicateIEEvent)return void(this.duplicateIEEvent=!1);this.messages=[],this.files=this.files||[];let l=e.dataTransfer?e.dataTransfer.files:e.target.files;for(let e of l)this.isFileSelected(e)||this.validate(e)&&(this.isImage(e)&&(e.objectURL=window.URL.createObjectURL(e)),this.files.push(e));this.$emit("select",{originalEvent:e,files:this.files}),this.fileLimit&&this.checkFileLimit(),this.auto&&this.hasFiles&&!this.isFileLimitExceeded()&&this.upload(),"drop"!==e.type&&this.isIE11()?this.clearIEInput():this.clearInputElement()},choose(){this.$refs.fileInput.click()},upload(){if(this.customUpload)this.fileLimit&&(this.uploadedFileCount+=this.files.length),this.$emit("uploader",{files:this.files}),this.clear();else{let e=new XMLHttpRequest,l=new FormData;this.$emit("before-upload",{xhr:e,formData:l});for(let e of this.files)l.append(this.name,e,e.name);e.upload.addEventListener("progress",(e=>{e.lengthComputable&&(this.progress=Math.round(100*e.loaded/e.total)),this.$emit("progress",{originalEvent:e,progress:this.progress})})),e.onreadystatechange=()=>{4===e.readyState&&(this.progress=0,e.status>=200&&e.status<300?(this.fileLimit&&(this.uploadedFileCount+=this.files.length),this.$emit("upload",{xhr:e,files:this.files})):this.$emit("error",{xhr:e,files:this.files}),this.uploadedFiles.push(...this.files),this.clear())},e.open("POST",this.url,!0),this.$emit("before-send",{xhr:e,formData:l}),e.withCredentials=this.withCredentials,e.send(l)}},clear(){this.files=[],this.messages=null,this.$emit("clear"),this.isAdvanced&&this.clearInputElement()},onFocus(){this.focused=!0},onBlur(){this.focused=!1},isFileSelected(e){if(this.files&&this.files.length)for(let l of this.files)if(l.name+l.type+l.size===e.name+e.type+e.size)return!0;return!1},isIE11:()=>!!window.MSInputMethodContext&&!!document.documentMode,validate(e){return this.accept&&!this.isFileTypeValid(e)?(this.messages.push(this.invalidFileTypeMessage.replace("{0}",e.name).replace("{1}",this.accept)),!1):!(this.maxFileSize&&e.size>this.maxFileSize)||(this.messages.push(this.invalidFileSizeMessage.replace("{0}",e.name).replace("{1}",this.formatSize(this.maxFileSize))),!1)},isFileTypeValid(e){let l=this.accept.split(",").map((e=>e.trim()));for(let t of l){if(this.isWildcard(t)?this.getTypeClass(e.type)===this.getTypeClass(t):e.type==t||this.getFileExtension(e).toLowerCase()===t.toLowerCase())return!0}return!1},getTypeClass:e=>e.substring(0,e.indexOf("/")),isWildcard:e=>-1!==e.indexOf("*"),getFileExtension:e=>"."+e.name.split(".").pop(),isImage:e=>/^image\//.test(e.type),onDragEnter(e){this.disabled||(e.stopPropagation(),e.preventDefault())},onDragOver(e){this.disabled||(n.DomHandler.addClass(this.$refs.content,"p-fileupload-highlight"),e.stopPropagation(),e.preventDefault())},onDragLeave(){this.disabled||n.DomHandler.removeClass(this.$refs.content,"p-fileupload-highlight")},onDrop(e){if(!this.disabled){n.DomHandler.removeClass(this.$refs.content,"p-fileupload-highlight"),e.stopPropagation(),e.preventDefault();const l=e.dataTransfer?e.dataTransfer.files:e.target.files;(this.multiple||l&&1===l.length)&&this.onFileSelect(e)}},onBasicUploaderClick(){this.hasFiles?this.upload():this.$refs.fileInput.click()},remove(e){this.clearInputElement();let l=this.files.splice(e,1)[0];this.files=[...this.files],this.$emit("remove",{file:l,files:this.files})},removeUploadedFile(e){let l=this.uploadedFiles.splice(e,1)[0];this.uploadedFiles=[...this.uploadedFiles],this.$emit("remove-uploaded-file",{file:l,files:this.uploadedFiles})},clearInputElement(){this.$refs.fileInput.value=""},clearIEInput(){this.$refs.fileInput&&(this.duplicateIEEvent=!0,this.$refs.fileInput.value="")},formatSize(e){if(0===e)return"0 B";let l=Math.floor(Math.log(e)/Math.log(1e3));return parseFloat((e/Math.pow(1e3,l)).toFixed(3))+" "+["B","KB","MB","GB","TB","PB","EB","ZB","YB"][l]},isFileLimitExceeded(){return this.fileLimit&&this.fileLimit<=this.files.length+this.uploadedFileCount&&this.focused&&(this.focused=!1),this.fileLimit&&this.fileLimit<this.files.length+this.uploadedFileCount},checkFileLimit(){this.isFileLimitExceeded()&&this.messages.push(this.invalidFileLimitMessage.replace("{0}",this.fileLimit.toString()))},onMessageClose(){this.messages=null}},computed:{isAdvanced(){return"advanced"===this.mode},isBasic(){return"basic"===this.mode},advancedChooseButtonClass(){return["p-button p-component p-fileupload-choose",this.class,{"p-disabled":this.disabled,"p-focus":this.focused}]},basicChooseButtonClass(){return["p-button p-component p-fileupload-choose",this.class,{"p-fileupload-choose-selected":this.hasFiles,"p-disabled":this.disabled,"p-focus":this.focused}]},basicChooseButtonLabel(){return this.auto?this.chooseButtonLabel:this.hasFiles?this.files.map((e=>e.name)).join(", "):this.chooseButtonLabel},hasFiles(){return this.files&&this.files.length>0},hasUploadedFiles(){return this.uploadedFiles&&this.uploadedFiles.length>0},chooseDisabled(){return this.disabled||this.fileLimit&&this.fileLimit<=this.files.length+this.uploadedFileCount},uploadDisabled(){return this.disabled||!this.hasFiles||this.fileLimit&&this.fileLimit<this.files.length},cancelDisabled(){return this.disabled||!this.hasFiles},chooseButtonLabel(){return this.chooseLabel||this.$primevue.config.locale.choose},uploadButtonLabel(){return this.uploadLabel||this.$primevue.config.locale.upload},cancelButtonLabel(){return this.cancelLabel||this.$primevue.config.locale.cancel},completedLabel(){return this.$primevue.config.locale.completed},pendingLabel(){return this.$primevue.config.locale.pending}},components:{FileUploadButton:c.default,FileUploadProgressBar:g.default,FileUploadMessage:m.default,FileContent:B,PlusIcon:u.default,UploadIcon:f.default,TimesIcon:h.default},directives:{ripple:v.default}};const E={key:0,class:"p-fileupload p-fileupload-advanced p-component"},I=["multiple","accept","disabled"],w={class:"p-fileupload-buttonbar"},D={class:"p-button-label"},x={key:0,class:"p-fileupload-empty"},$={key:1,class:"p-fileupload p-fileupload-basic p-component"},V={class:"p-button-label"},U=["accept","disabled","multiple"];return function(e,l){void 0===l&&(l={});var t=l.insertAt;if(e&&"undefined"!=typeof document){var i=document.head||document.getElementsByTagName("head")[0],s=document.createElement("style");s.type="text/css","top"===t&&i.firstChild?i.insertBefore(s,i.firstChild):i.appendChild(s),s.styleSheet?s.styleSheet.cssText=e:s.appendChild(document.createTextNode(e))}}("\n.p-fileupload-content {\n    position: relative;\n}\n.p-fileupload-content .p-progressbar {\n    width: 100%;\n    position: absolute;\n    top: 0;\n    left: 0;\n}\n.p-button.p-fileupload-choose {\n    position: relative;\n    overflow: hidden;\n}\n.p-fileupload-buttonbar {\n    display: flex;\n    flex-wrap: wrap;\n}\n.p-fileupload > input[type='file'],\n.p-fileupload-basic input[type='file'] {\n    display: none;\n}\n.p-fluid .p-fileupload .p-button {\n    width: auto;\n}\n.p-fileupload-file {\n    display: flex;\n    flex-wrap: wrap;\n    align-items: center;\n}\n.p-fileupload-file-thumbnail {\n    flex-shrink: 0;\n}\n.p-fileupload-file-actions {\n    margin-left: auto;\n}\n"),L.render=function(e,l,t,i,s,o){const a=d.resolveComponent("FileUploadButton"),n=d.resolveComponent("FileUploadProgressBar"),r=d.resolveComponent("FileUploadMessage"),p=d.resolveComponent("FileContent"),c=d.resolveDirective("ripple");return o.isAdvanced?(d.openBlock(),d.createElementBlock("div",E,[d.createElementVNode("input",{ref:"fileInput",type:"file",onChange:l[0]||(l[0]=(...e)=>o.onFileSelect&&o.onFileSelect(...e)),multiple:t.multiple,accept:t.accept,disabled:o.chooseDisabled},null,40,I),d.createElementVNode("div",w,[d.renderSlot(e.$slots,"header",{files:s.files,uploadedFiles:s.uploadedFiles,chooseCallback:o.choose,uploadCallback:o.upload,clearCallback:o.clear},(()=>[d.withDirectives((d.openBlock(),d.createElementBlock("span",{class:d.normalizeClass(o.advancedChooseButtonClass),style:d.normalizeStyle(t.style),onClick:l[1]||(l[1]=(...e)=>o.choose&&o.choose(...e)),onKeydown:l[2]||(l[2]=d.withKeys(((...e)=>o.choose&&o.choose(...e)),["enter"])),onFocus:l[3]||(l[3]=(...e)=>o.onFocus&&o.onFocus(...e)),onBlur:l[4]||(l[4]=(...e)=>o.onBlur&&o.onBlur(...e)),tabindex:"0"},[d.renderSlot(e.$slots,"chooseicon",{},(()=>[(d.openBlock(),d.createBlock(d.resolveDynamicComponent(t.chooseIcon?"span":"PlusIcon"),{class:d.normalizeClass(["p-button-icon p-button-icon-left",t.chooseIcon]),"aria-hidden":"true"},null,8,["class"]))])),d.createElementVNode("span",D,d.toDisplayString(o.chooseButtonLabel),1)],38)),[[c]]),t.showUploadButton?(d.openBlock(),d.createBlock(a,{key:0,label:o.uploadButtonLabel,onClick:o.upload,disabled:o.uploadDisabled},{icon:d.withCtx((l=>[d.renderSlot(e.$slots,"uploadicon",{},(()=>[(d.openBlock(),d.createBlock(d.resolveDynamicComponent(t.uploadIcon?"span":"UploadIcon"),{class:d.normalizeClass([l.class,t.uploadIcon]),"aria-hidden":"true"},null,8,["class"]))]))])),_:3},8,["label","onClick","disabled"])):d.createCommentVNode("",!0),t.showCancelButton?(d.openBlock(),d.createBlock(a,{key:1,label:o.cancelButtonLabel,onClick:o.clear,disabled:o.cancelDisabled},{icon:d.withCtx((l=>[d.renderSlot(e.$slots,"cancelicon",{},(()=>[(d.openBlock(),d.createBlock(d.resolveDynamicComponent(t.cancelIcon?"span":"TimesIcon"),{class:d.normalizeClass([l.class,t.cancelIcon]),"aria-hidden":"true"},null,8,["class"]))]))])),_:3},8,["label","onClick","disabled"])):d.createCommentVNode("",!0)]))]),d.createElementVNode("div",{ref:"content",class:"p-fileupload-content",onDragenter:l[5]||(l[5]=(...e)=>o.onDragEnter&&o.onDragEnter(...e)),onDragover:l[6]||(l[6]=(...e)=>o.onDragOver&&o.onDragOver(...e)),onDragleave:l[7]||(l[7]=(...e)=>o.onDragLeave&&o.onDragLeave(...e)),onDrop:l[8]||(l[8]=(...e)=>o.onDrop&&o.onDrop(...e))},[d.renderSlot(e.$slots,"content",{files:s.files,uploadedFiles:s.uploadedFiles,removeUploadedFileCallback:o.removeUploadedFile,removeFileCallback:o.remove,progress:s.progress,messages:s.messages},(()=>[o.hasFiles?(d.openBlock(),d.createBlock(n,{key:0,value:s.progress,showValue:!1},null,8,["value"])):d.createCommentVNode("",!0),(d.openBlock(!0),d.createElementBlock(d.Fragment,null,d.renderList(s.messages,(e=>(d.openBlock(),d.createBlock(r,{key:e,severity:"error",onClose:o.onMessageClose},{default:d.withCtx((()=>[d.createTextVNode(d.toDisplayString(e),1)])),_:2},1032,["onClose"])))),128)),o.hasFiles?(d.openBlock(),d.createBlock(p,{key:1,files:s.files,onRemove:o.remove,badgeValue:o.pendingLabel,previewWidth:t.previewWidth,templates:e.$slots},null,8,["files","onRemove","badgeValue","previewWidth","templates"])):d.createCommentVNode("",!0),d.createVNode(p,{files:s.uploadedFiles,onRemove:o.removeUploadedFile,badgeValue:o.completedLabel,badgeSeverity:"success",previewWidth:t.previewWidth,templates:e.$slots},null,8,["files","onRemove","badgeValue","previewWidth","templates"])])),!e.$slots.empty||o.hasFiles||o.hasUploadedFiles?d.createCommentVNode("",!0):(d.openBlock(),d.createElementBlock("div",x,[d.renderSlot(e.$slots,"empty")]))],544)])):o.isBasic?(d.openBlock(),d.createElementBlock("div",$,[(d.openBlock(!0),d.createElementBlock(d.Fragment,null,d.renderList(s.messages,(e=>(d.openBlock(),d.createBlock(r,{key:e,severity:"error",onClose:o.onMessageClose},{default:d.withCtx((()=>[d.createTextVNode(d.toDisplayString(e),1)])),_:2},1032,["onClose"])))),128)),d.withDirectives((d.openBlock(),d.createElementBlock("span",{class:d.normalizeClass(o.basicChooseButtonClass),style:d.normalizeStyle(t.style),onMouseup:l[12]||(l[12]=(...e)=>o.onBasicUploaderClick&&o.onBasicUploaderClick(...e)),onKeydown:l[13]||(l[13]=d.withKeys(((...e)=>o.choose&&o.choose(...e)),["enter"])),onFocus:l[14]||(l[14]=(...e)=>o.onFocus&&o.onFocus(...e)),onBlur:l[15]||(l[15]=(...e)=>o.onBlur&&o.onBlur(...e)),tabindex:"0"},[!o.hasFiles||t.auto?d.renderSlot(e.$slots,"uploadicon",{key:0},(()=>[(d.openBlock(),d.createBlock(d.resolveDynamicComponent(t.uploadIcon?"span":"UploadIcon"),{class:d.normalizeClass(["p-button-icon p-button-icon-left",t.uploadIcon]),"aria-hidden":"true"},null,8,["class"]))])):d.renderSlot(e.$slots,"chooseicon",{key:1},(()=>[(d.openBlock(),d.createBlock(d.resolveDynamicComponent(t.chooseIcon?"span":"PlusIcon"),{class:d.normalizeClass(["p-button-icon p-button-icon-left",t.chooseIcon]),"aria-hidden":"true"},null,8,["class"]))])),d.createElementVNode("span",V,d.toDisplayString(o.basicChooseButtonLabel),1),o.hasFiles?d.createCommentVNode("",!0):(d.openBlock(),d.createElementBlock("input",{key:2,ref:"fileInput",type:"file",accept:t.accept,disabled:t.disabled,multiple:t.multiple,onChange:l[9]||(l[9]=(...e)=>o.onFileSelect&&o.onFileSelect(...e)),onFocus:l[10]||(l[10]=(...e)=>o.onFocus&&o.onFocus(...e)),onBlur:l[11]||(l[11]=(...e)=>o.onBlur&&o.onBlur(...e))},null,40,U))],38)),[[c]])])):d.createCommentVNode("",!0)},L}(primevue.button,primevue.icons.plus,primevue.icons.times,primevue.icons.upload,primevue.message,primevue.progressbar,primevue.ripple,primevue.utils,primevue.badge,Vue);

package/galleria/Galleria.d.ts

@@ -205,6 +205,26 @@ export interface GalleriaSlots {
          */
         item: any;
     }): VNode[];
+    /**
+     * Custom close icon template.
+     */
+    closeicon(): VNode[];
+    /**
+     * Custom navigator previous item icon template.
+     */
+    previousitemicon(): VNode[];
+    /**
+     * Custom navigator next item icon template.
+     */
+    nextitemicon(): VNode[];
+    /**
+     * Custom thumbnail previous icon template.
+     */
+    previousthumbnailicon(): VNode[];
+    /**
+     * Custom thumbnail next item template.
+     */
+    nextthumbnailicon(): VNode[];
 }
 
 /**

package/galleria/Galleria.vue

@@ -2,11 +2,11 @@
     <Portal v-if="fullScreen">
         <div v-if="containerVisible" :ref="maskRef" :class="maskContentClass" :role="fullScreen ? 'dialog' : 'region'" :aria-modal="fullScreen ? 'true' : undefined">
             <transition name="p-galleria" @before-enter="onBeforeEnter" @enter="onEnter" @before-leave="onBeforeLeave" @after-leave="onAfterLeave" appear>
-                <GalleriaContent v-if="visible" :ref="containerRef" v-focustrap v-bind="$props" @mask-hide="maskHide" :templates="$slots" @activeitem-change="onActiveItemChange" />
+                <GalleriaContent v-if="visible" :ref="containerRef" v-focustrap @mask-hide="maskHide" :templates="$slots" @activeitem-change="onActiveItemChange" v-bind="$props" />
             </transition>
         </div>
     </Portal>
-    <GalleriaContent v-else v-bind="$props" :templates="$slots" @activeitem-change="onActiveItemChange" />
+    <GalleriaContent v-else :templates="$slots" @activeitem-change="onActiveItemChange" v-bind="$props" />
 </template>
 
 <script>

package/galleria/GalleriaContent.vue

@@ -1,7 +1,7 @@
 <template>
     <div v-if="$attrs.value && $attrs.value.length > 0" :id="id" :class="galleriaClass" :style="$attrs.containerStyle" v-bind="$attrs.containerProps">
         <button v-if="$attrs.fullScreen" v-ripple autofocus type="button" class="p-galleria-close p-link" :aria-label="closeAriaLabel" @click="$emit('mask-hide')">
-            <span class="p-galleria-close-icon pi pi-times"></span>
+            <component :is="$attrs.templates['closeicon'] || 'TimesIcon'" class="p-galleria-close-icon" />
         </button>
         <div v-if="$attrs.templates && $attrs.templates['header']" class="p-galleria-header">
             <component :is="$attrs.templates['header']" />
@@ -47,6 +47,7 @@
 </template>
 
 <script>
+import TimesIcon from 'primevue/icons/times';
 import Ripple from 'primevue/ripple';
 import { UniqueComponentId } from 'primevue/utils';
 import GalleriaItem from './GalleriaItem.vue';
@@ -76,6 +77,9 @@ export default {
         },
         '$attrs.numVisible': function (newVal) {
             this.numVisible = newVal;
+        },
+        '$attrs.autoPlay': function (newVal) {
+            newVal ? this.startSlideShow() : this.stopSlideShow();
         }
     },
     updated() {
@@ -139,7 +143,8 @@ export default {
     },
     components: {
         GalleriaItem: GalleriaItem,
-        GalleriaThumbnails: GalleriaThumbnails
+        GalleriaThumbnails: GalleriaThumbnails,
+        TimesIcon: TimesIcon
     },
     directives: {
         ripple: Ripple

package/galleria/GalleriaItem.vue

@@ -2,13 +2,13 @@
     <div class="p-galleria-item-wrapper">
         <div class="p-galleria-item-container">
             <button v-if="showItemNavigators" v-ripple type="button" :class="navBackwardClass" @click="navBackward($event)" :disabled="isNavBackwardDisabled()">
-                <span class="p-galleria-item-prev-icon pi pi-chevron-left"></span>
+                <component :is="templates.previousitemicon || 'ChevronLeftIcon'" class="p-galleria-item-prev-icon" />
             </button>
             <div :id="id + '_item_' + activeIndex" class="p-galleria-item" role="group" :aria-label="ariaSlideNumber(activeIndex + 1)" :aria-roledescription="ariaSlideLabel">
                 <component v-if="templates.item" :is="templates.item" :item="activeItem" />
             </div>
             <button v-if="showItemNavigators" v-ripple type="button" :class="navForwardClass" @click="navForward($event)" :disabled="isNavForwardDisabled()">
-                <span class="p-galleria-item-next-icon pi pi-chevron-right"></span>
+                <component :is="templates.nextitemicon || 'ChevronRightIcon'" class="p-galleria-item-next-icon" />
             </button>
             <div v-if="templates['caption']" class="p-galleria-caption">
                 <component v-if="templates.caption" :is="templates.caption" :item="activeItem" />
@@ -35,6 +35,8 @@
 </template>
 
 <script>
+import ChevronLeftIcon from 'primevue/icons/chevronleft';
+import ChevronRightIcon from 'primevue/icons/chevronright';
 import Ripple from 'primevue/ripple';
 
 export default {
@@ -191,6 +193,10 @@ export default {
             return this.$primevue.config.locale.aria ? this.$primevue.config.locale.aria.slide : undefined;
         }
     },
+    components: {
+        ChevronLeftIcon: ChevronLeftIcon,
+        ChevronRightIcon: ChevronRightIcon
+    },
     directives: {
         ripple: Ripple
     }

package/galleria/GalleriaThumbnails.vue

@@ -2,7 +2,7 @@
     <div class="p-galleria-thumbnail-wrapper">
         <div class="p-galleria-thumbnail-container">
             <button v-if="showThumbnailNavigators" v-ripple :class="navBackwardClass" :disabled="isNavBackwardDisabled()" type="button" :aria-label="ariaPrevButtonLabel" @click="navBackward($event)" v-bind="prevButtonProps">
-                <span :class="navBackwardIconClass"></span>
+                <component :is="templates.previousthumbnailicon || (isVertical ? 'ChevronUpIcon' : 'ChevronLeftIcon')" class="p-galleria-thumbnail-prev-icon" />
             </button>
             <div class="p-galleria-thumbnail-items-container" :style="{ height: isVertical ? contentHeight : '' }">
                 <div ref="itemsContainer" class="p-galleria-thumbnail-items" role="tablist" @transitionend="onTransitionEnd" @touchstart="onTouchStart($event)" @touchmove="onTouchMove($event)" @touchend="onTouchEnd($event)">
@@ -30,13 +30,17 @@
                 </div>
             </div>
             <button v-if="showThumbnailNavigators" v-ripple :class="navForwardClass" :disabled="isNavForwardDisabled()" type="button" :aria-label="ariaNextButtonLabel" @click="navForward($event)" v-bind="nextButtonProps">
-                <span :class="navForwardIconClass"></span>
+                <component :is="templates.nextthumbnailicon || (isVertical ? 'ChevronDownIcon' : 'ChevronRightIcon')" class="p-galleria-thumbnail-prev-icon" />
             </button>
         </div>
     </div>
 </template>
 
 <script>
+import ChevronDownIcon from 'primevue/icons/chevrondown';
+import ChevronLeftIcon from 'primevue/icons/chevronleft';
+import ChevronRightIcon from 'primevue/icons/chevronright';
+import ChevronUpIcon from 'primevue/icons/chevronup';
 import Ripple from 'primevue/ripple';
 import { DomHandler } from 'primevue/utils';
 
@@ -501,24 +505,6 @@ export default {
                 }
             ];
         },
-        navBackwardIconClass() {
-            return [
-                'p-galleria-thumbnail-prev-icon pi',
-                {
-                    'pi-chevron-left': !this.isVertical,
-                    'pi-chevron-up': this.isVertical
-                }
-            ];
-        },
-        navForwardIconClass() {
-            return [
-                'p-galleria-thumbnail-next-icon pi',
-                {
-                    'pi-chevron-right': !this.isVertical,
-                    'pi-chevron-down': this.isVertical
-                }
-            ];
-        },
         ariaPrevButtonLabel() {
             return this.$primevue.config.locale.aria ? this.$primevue.config.locale.aria.prevPageLabel : undefined;
         },
@@ -526,6 +512,12 @@ export default {
             return this.$primevue.config.locale.aria ? this.$primevue.config.locale.aria.nextPageLabel : undefined;
         }
     },
+    components: {
+        ChevronLeftIcon: ChevronLeftIcon,
+        ChevronRightIcon: ChevronRightIcon,
+        ChevronUpIcon: ChevronUpIcon,
+        ChevronDownIcon: ChevronDownIcon
+    },
     directives: {
         ripple: Ripple
     }