2 lines
16 KiB
JavaScript
2 lines
16 KiB
JavaScript
import e,{Component as t}from"react";import{Button as n}from"primereact/button";import{Messages as o}from"primereact/messages";import{ProgressBar as s}from"primereact/progressbar";import{DomHandler as i,classNames as r,IconUtils as l,ObjectUtils as a}from"primereact/utils";import{Ripple as p}from"primereact/ripple";import{localeOption as u}from"primereact/api";function c(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,o=new Array(t);n<t;n++)o[n]=e[n];return o}function h(e){if(Array.isArray(e))return c(e)}function f(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}function d(e,t){if(e){if("string"==typeof e)return c(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?c(e,t):void 0}}function m(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function y(e){return h(e)||f(e)||d(e)||m()}function v(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function b(e,t){for(var n=0;n<t.length;n++){var o=t[n];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(e,o.key,o)}}function g(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}function E(e,t){return E=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e},E(e,t)}function S(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),Object.defineProperty(e,"prototype",{writable:!1}),t&&E(e,t)}function k(e){return k="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},k(e)}function w(e,t){if(t&&("object"===k(t)||"function"==typeof t))return t;if(void 0!==t)throw new TypeError("Derived constructors may only return object or undefined");return g(e)}function F(e){return F=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)},F(e)}function B(e,t){var n="undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(!n){if(Array.isArray(e)||(n=I(e))||t&&e&&"number"==typeof e.length){n&&(e=n);var o=0,s=function(){};return{s:s,n:function(){return o>=e.length?{done:!0}:{done:!1,value:e[o++]}},e:function(e){throw e},f:s}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var i,r=!0,l=!1;return{s:function(){n=n.call(e)},n:function(){var e=n.next();return r=e.done,e},e:function(e){l=!0,i=e},f:function(){try{r||null==n.return||n.return()}finally{if(l)throw i}}}}function I(e,t){if(e){if("string"==typeof e)return D(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?D(e,t):void 0}}function D(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,o=new Array(t);n<t;n++)o[n]=e[n];return o}function O(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}var C,N,L,T=function(c){S(I,t);var h,f,d,m,E,k=(h=I,f=O(),function(){var e,t=F(h);if(f){var n=F(this).constructor;e=Reflect.construct(t,arguments,n)}else e=t.apply(this,arguments);return w(this,e)});function I(e){var t;return v(this,I),(t=k.call(this,e)).state={files:[],msgs:[],focused:!1,progress:0},t.choose=t.choose.bind(g(t)),t.upload=t.upload.bind(g(t)),t.clear=t.clear.bind(g(t)),t.onFileSelect=t.onFileSelect.bind(g(t)),t.onDragEnter=t.onDragEnter.bind(g(t)),t.onDragOver=t.onDragOver.bind(g(t)),t.onDragLeave=t.onDragLeave.bind(g(t)),t.onDrop=t.onDrop.bind(g(t)),t.onKeyDown=t.onKeyDown.bind(g(t)),t.onFocus=t.onFocus.bind(g(t)),t.onBlur=t.onBlur.bind(g(t)),t.onSimpleUploaderClick=t.onSimpleUploaderClick.bind(g(t)),t.duplicateIEEvent=!1,t}return d=I,(m=[{key:"hasFiles",value:function(){return this.state.files&&this.state.files.length>0}},{key:"isImage",value:function(e){return/^image\//.test(e.type)}},{key:"chooseDisabled",value:function(){return this.props.disabled||this.props.fileLimit&&this.props.fileLimit<=this.state.files.length+this.uploadedFileCount}},{key:"uploadDisabled",value:function(){return this.props.disabled||!this.hasFiles()}},{key:"cancelDisabled",value:function(){return this.props.disabled||!this.hasFiles()}},{key:"chooseButtonLabel",value:function(){return this.props.chooseLabel||this.props.chooseOptions.label||u("choose")}},{key:"uploadButtonLabel",value:function(){return this.props.uploadLabel||this.props.uploadOptions.label||u("upload")}},{key:"cancelButtonLabel",value:function(){return this.props.cancelLabel||this.props.cancelOptions.label||u("cancel")}},{key:"remove",value:function(e,t){this.clearInputElement();var n=y(this.state.files),o=this.state.files[t];n.splice(t,1),this.setState({files:n}),this.props.onRemove&&this.props.onRemove({originalEvent:e,file:o})}},{key:"clearInputElement",value:function(){this.fileInput&&(this.fileInput.value="")}},{key:"clearIEInput",value:function(){this.fileInput&&(this.duplicateIEEvent=!0,this.fileInput.value="")}},{key:"formatSize",value:function(e){if(0===e)return"0 B";var 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]}},{key:"onFileSelect",value:function(e){var t=this;if("drop"!==e.type&&this.isIE11()&&this.duplicateIEEvent)this.duplicateIEEvent=!1;else{this.setState({msgs:[]}),this.files=this.state.files?y(this.state.files):[];for(var n=e.dataTransfer?e.dataTransfer.files:e.target.files,o=0;o<n.length;o++){var s=n[o];this.isFileSelected(s)||this.validate(s)&&(this.isImage(s)&&(s.objectURL=window.URL.createObjectURL(s)),this.files.push(s))}this.setState({files:this.files},(function(){t.hasFiles()&&t.props.auto&&t.upload()})),this.props.onSelect&&this.props.onSelect({originalEvent:e,files:n}),"drop"!==e.type&&this.isIE11()?this.clearIEInput():this.clearInputElement(),"basic"===this.props.mode&&this.files.length>0&&(this.fileInput.style.display="none")}}},{key:"isFileSelected",value:function(e){var t,n=B(this.state.files);try{for(n.s();!(t=n.n()).done;){var o=t.value;if(o.name+o.type+o.size===e.name+e.type+e.size)return!0}}catch(e){n.e(e)}finally{n.f()}return!1}},{key:"isIE11",value:function(){return!!window.MSInputMethodContext&&!!document.documentMode}},{key:"validate",value:function(e){if(this.props.maxFileSize&&e.size>this.props.maxFileSize){var t={severity:"error",summary:this.props.invalidFileSizeMessageSummary.replace("{0}",e.name),detail:this.props.invalidFileSizeMessageDetail.replace("{0}",this.formatSize(this.props.maxFileSize))};return"advanced"===this.props.mode&&this.messagesUI.show(t),this.props.onValidationFail&&this.props.onValidationFail(e),!1}return!0}},{key:"upload",value:function(){var e=this;if(this.props.customUpload)this.props.fileLimit&&(this.uploadedFileCount+=this.state.files.length),this.props.uploadHandler&&this.props.uploadHandler({files:this.state.files,options:{clear:this.clear,props:this.props}});else{this.setState({msgs:[]});var t=new XMLHttpRequest,n=new FormData;this.props.onBeforeUpload&&this.props.onBeforeUpload({xhr:t,formData:n});var o,s=B(this.state.files);try{for(s.s();!(o=s.n()).done;){var i=o.value;n.append(this.props.name,i,i.name)}}catch(e){s.e(e)}finally{s.f()}t.upload.addEventListener("progress",(function(t){t.lengthComputable&&e.setState({progress:Math.round(100*t.loaded/t.total)},(function(){e.props.onProgress&&e.props.onProgress({originalEvent:t,progress:e.state.progress})}))})),t.onreadystatechange=function(){4===t.readyState&&(e.setState({progress:0}),t.status>=200&&t.status<300?(e.props.fileLimit&&(e.uploadedFileCount+=e.state.files.length),e.props.onUpload&&e.props.onUpload({xhr:t,files:e.state.files})):e.props.onError&&e.props.onError({xhr:t,files:e.state.files}),e.clear())},t.open("POST",this.props.url,!0),this.props.onBeforeSend&&this.props.onBeforeSend({xhr:t,formData:n}),t.withCredentials=this.props.withCredentials,t.send(n)}}},{key:"clear",value:function(){this.setState({files:[]}),this.props.onClear&&this.props.onClear(),this.clearInputElement()}},{key:"choose",value:function(){this.fileInput.click()}},{key:"onFocus",value:function(){this.setState({focused:!0})}},{key:"onBlur",value:function(){this.setState({focused:!1})}},{key:"onKeyDown",value:function(e){13===e.which&&this.choose()}},{key:"onDragEnter",value:function(e){this.props.disabled||(e.dataTransfer.dropEffect="copy",e.stopPropagation(),e.preventDefault())}},{key:"onDragOver",value:function(e){this.props.disabled||(e.dataTransfer.dropEffect="copy",i.addClass(this.content,"p-fileupload-highlight"),e.stopPropagation(),e.preventDefault())}},{key:"onDragLeave",value:function(e){this.props.disabled||(e.dataTransfer.dropEffect="copy",i.removeClass(this.content,"p-fileupload-highlight"))}},{key:"onDrop",value:function(e){if(!this.props.disabled){i.removeClass(this.content,"p-fileupload-highlight"),e.stopPropagation(),e.preventDefault();var t=e.dataTransfer?e.dataTransfer.files:e.target.files;(this.props.multiple||t&&0===t.length)&&this.onFileSelect(e)}}},{key:"onSimpleUploaderClick",value:function(){this.hasFiles()?this.upload():this.fileInput.click()}},{key:"renderChooseButton",value:function(){var t=this,n=this.props.chooseOptions,o=n.style,s=n.icon,i=n.iconOnly,a=r("p-button p-fileupload-choose p-component",{"p-disabled":this.props.disabled,"p-focus":this.state.focused,"p-button-icon-only":i},n.className),u="p-button-label p-clickable",c=i?e.createElement("span",{className:u,dangerouslySetInnerHTML:{__html:" "}}):e.createElement("span",{className:u},this.chooseButtonLabel());return e.createElement("span",{className:a,style:o,onClick:this.choose,onKeyDown:this.onKeyDown,onFocus:this.onFocus,onBlur:this.onBlur,tabIndex:0},e.createElement("input",{ref:function(e){return t.fileInput=e},type:"file",onChange:this.onFileSelect,multiple:this.props.multiple,accept:this.props.accept,disabled:this.chooseDisabled()}),l.getJSXIcon(s||"pi pi-fw pi-plus",{className:"p-button-icon p-button-icon-left p-clickable"},{props:this.props}),c,e.createElement(p,null))}},{key:"renderFile",value:function(t,o){var s=this,i=this.isImage(t)?e.createElement("div",null,e.createElement("img",{alt:t.name,role:"presentation",src:t.objectURL,width:this.props.previewWidth})):null,r=e.createElement("div",{className:"p-fileupload-filename"},t.name),l=e.createElement("div",null,this.formatSize(t.size)),p=e.createElement("div",null,e.createElement(n,{type:"button",icon:"pi pi-times",onClick:function(e){return s.remove(e,o)}})),u=e.createElement(e.Fragment,null,i,r,l,p);if(this.props.itemTemplate){var c={onRemove:function(e){return s.remove(e,o)},previewElement:i,fileNameElement:r,sizeElement:l,removeElement:p,formatSize:this.formatSize(t.size),files:this.state.files,index:o,element:u,props:this.props};u=a.getJSXElement(this.props.itemTemplate,t,c)}return e.createElement("div",{className:"p-fileupload-row",key:t.name+t.type+t.size},u)}},{key:"renderFiles",value:function(){var t=this;return e.createElement("div",{className:"p-fileupload-files"},this.state.files.map((function(e,n){return t.renderFile(e,n)})))}},{key:"renderEmptyContent",value:function(){return this.props.emptyTemplate&&!this.hasFiles()?a.getJSXElement(this.props.emptyTemplate,this.props):null}},{key:"renderProgressBarContent",value:function(){return this.props.progressBarTemplate?a.getJSXElement(this.props.progressBarTemplate,this.props):e.createElement(s,{value:this.state.progress,showValue:!1})}},{key:"renderAdvanced",value:function(){var t,s,i,l,p=this,u=r("p-fileupload p-fileupload-advanced p-component",this.props.className),c=r("p-fileupload-buttonbar",this.props.headerClassName),h=r("p-fileupload-content",this.props.contentClassName),f=this.renderChooseButton(),d=this.renderEmptyContent();if(!this.props.auto){var m=this.props.uploadOptions,y=this.props.cancelOptions,v=m.iconOnly?"":this.uploadButtonLabel(),b=y.iconOnly?"":this.cancelButtonLabel();t=e.createElement(n,{type:"button",label:v,icon:m.icon||"pi pi-upload",onClick:this.upload,disabled:this.uploadDisabled(),style:m.style,className:m.className}),s=e.createElement(n,{type:"button",label:b,icon:y.icon||"pi pi-times",onClick:this.clear,disabled:this.cancelDisabled(),style:y.style,className:y.className})}this.hasFiles()&&(i=this.renderFiles(),l=this.renderProgressBarContent());var g=e.createElement("div",{className:c,style:this.props.headerStyle},f,t,s);return this.props.headerTemplate&&(g=a.getJSXElement(this.props.headerTemplate,{className:c,chooseButton:f,uploadButton:t,cancelButton:s,element:g,props:this.props})),e.createElement("div",{id:this.props.id,className:u,style:this.props.style},g,e.createElement("div",{ref:function(e){p.content=e},className:h,style:this.props.contentStyle,onDragEnter:this.onDragEnter,onDragOver:this.onDragOver,onDragLeave:this.onDragLeave,onDrop:this.onDrop},l,e.createElement(o,{ref:function(e){return p.messagesUI=e}}),i,d))}},{key:"renderBasic",value:function(){var t=this,n=this.hasFiles(),s=this.props.chooseOptions,i=r("p-fileupload p-fileupload-basic p-component",this.props.className),a=r("p-button p-component p-fileupload-choose",{"p-fileupload-choose-selected":n,"p-disabled":this.props.disabled,"p-focus":this.state.focused},s.className),u=s.icon||r({"pi pi-plus":!s.icon&&(!n||this.props.auto),"pi pi-upload":!s.icon&&n&&!this.props.auto}),c="p-button-label p-clickable",h=s.iconOnly?e.createElement("span",{className:c,dangerouslySetInnerHTML:{__html:" "}}):e.createElement("span",{className:c},this.chooseButtonLabel()),f=this.props.auto?h:e.createElement("span",{className:c},n?this.state.files[0].name:h),d=l.getJSXIcon(u,{className:"p-button-icon p-button-icon-left"},{props:this.props,hasFiles:n});return e.createElement("div",{className:i,style:this.props.style},e.createElement(o,{ref:function(e){return t.messagesUI=e}}),e.createElement("span",{className:a,style:s.style,onMouseUp:this.onSimpleUploaderClick,onKeyDown:this.onKeyDown,onFocus:this.onFocus,onBlur:this.onBlur,tabIndex:0},d,f,!n&&e.createElement("input",{ref:function(e){return t.fileInput=e},type:"file",accept:this.props.accept,multiple:this.props.multiple,disabled:this.props.disabled,onChange:this.onFileSelect}),e.createElement(p,null)))}},{key:"render",value:function(){return"advanced"===this.props.mode?this.renderAdvanced():"basic"===this.props.mode?this.renderBasic():void 0}}])&&b(d.prototype,m),E&&b(d,E),Object.defineProperty(d,"prototype",{writable:!1}),I}();L={id:null,name:null,url:null,mode:"advanced",multiple:!1,accept:null,disabled:!1,auto:!1,maxFileSize:null,invalidFileSizeMessageSummary:"{0}: Invalid file size, ",invalidFileSizeMessageDetail:"maximum upload size is {0}.",style:null,className:null,widthCredentials:!1,previewWidth:50,chooseLabel:null,uploadLabel:null,cancelLabel:null,chooseOptions:{label:null,icon:null,iconOnly:!1,className:null,style:null},uploadOptions:{label:null,icon:null,iconOnly:!1,className:null,style:null},cancelOptions:{label:null,icon:null,iconOnly:!1,className:null,style:null},customUpload:!1,headerClassName:null,headerStyle:null,contentClassName:null,contentStyle:null,headerTemplate:null,itemTemplate:null,emptyTemplate:null,progressBarTemplate:null,onBeforeUpload:null,onBeforeSend:null,onUpload:null,onError:null,onClear:null,onSelect:null,onProgress:null,onValidationFail:null,uploadHandler:null,onRemove:null},(N="defaultProps")in(C=T)?Object.defineProperty(C,N,{value:L,enumerable:!0,configurable:!0,writable:!0}):C[N]=L;export{T as FileUpload};
|