primereact 6.6.0 → 7.0.1

package/fileupload/fileupload.cjs.js

@@ -6,7 +6,8 @@ var React = require('react');
 var button = require('primereact/button');
 var messages = require('primereact/messages');
 var progressbar = require('primereact/progressbar');
-var core = require('primereact/core');
+var utils = require('primereact/utils');
+var ripple = require('primereact/ripple');
 var api = require('primereact/api');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -121,6 +122,8 @@ function _typeof(obj) {
 function _possibleConstructorReturn(self, call) {
   if (call && (_typeof(call) === "object" || typeof call === "function")) {
     return call;
+  } else if (call !== void 0) {
+    throw new TypeError("Derived constructors may only return object or undefined");
   }
 
   return _assertThisInitialized(self);
@@ -291,7 +294,7 @@ var FileUpload = /*#__PURE__*/function (_Component) {
       this.setState({
         msgs: []
       });
-      this.files = this.state.files || [];
+      this.files = this.state.files ? _toConsumableArray(this.state.files) : [];
       var files = event.dataTransfer ? event.dataTransfer.files : event.target.files;
 
       for (var i = 0; i < files.length; i++) {
@@ -529,6 +532,7 @@ var FileUpload = /*#__PURE__*/function (_Component) {
     key: "onDragEnter",
     value: function onDragEnter(event) {
       if (!this.props.disabled) {
+        event.dataTransfer.dropEffect = "copy";
         event.stopPropagation();
         event.preventDefault();
       }
@@ -537,7 +541,8 @@ var FileUpload = /*#__PURE__*/function (_Component) {
     key: "onDragOver",
     value: function onDragOver(event) {
       if (!this.props.disabled) {
-        core.DomHandler.addClass(this.content, 'p-fileupload-highlight');
+        event.dataTransfer.dropEffect = "copy";
+        utils.DomHandler.addClass(this.content, 'p-fileupload-highlight');
         event.stopPropagation();
         event.preventDefault();
       }
@@ -546,18 +551,19 @@ var FileUpload = /*#__PURE__*/function (_Component) {
     key: "onDragLeave",
     value: function onDragLeave(event) {
       if (!this.props.disabled) {
-        core.DomHandler.removeClass(this.content, 'p-fileupload-highlight');
+        event.dataTransfer.dropEffect = "copy";
+        utils.DomHandler.removeClass(this.content, 'p-fileupload-highlight');
       }
     }
   }, {
     key: "onDrop",
     value: function onDrop(event) {
       if (!this.props.disabled) {
-        core.DomHandler.removeClass(this.content, 'p-fileupload-highlight');
+        utils.DomHandler.removeClass(this.content, 'p-fileupload-highlight');
         event.stopPropagation();
         event.preventDefault();
         var files = event.dataTransfer ? event.dataTransfer.files : event.target.files;
-        var allowDrop = this.props.multiple || files && files.length === 1;
+        var allowDrop = this.props.multiple || files && files.length === 0;
 
         if (allowDrop) {
           this.onFileSelect(event);
@@ -583,24 +589,21 @@ var FileUpload = /*#__PURE__*/function (_Component) {
           style = _this$props$chooseOpt.style,
           icon = _this$props$chooseOpt.icon,
           iconOnly = _this$props$chooseOpt.iconOnly;
-      var chooseClassName = core.classNames('p-button p-fileupload-choose p-component', {
+      var chooseClassName = utils.classNames('p-button p-fileupload-choose p-component', {
         'p-disabled': this.props.disabled,
         'p-focus': this.state.focused,
         'p-button-icon-only': iconOnly
       }, className);
-      var chooseIconClassName = core.classNames('p-button-icon p-button-icon-left p-clickable', {
-        'pi pi-fw pi-plus': !icon
-      }, icon);
       var labelClassName = 'p-button-label p-clickable';
-      var label = iconOnly ? /*#__PURE__*/React__default['default'].createElement("span", {
+      var label = iconOnly ? /*#__PURE__*/React__default["default"].createElement("span", {
         className: labelClassName,
         dangerouslySetInnerHTML: {
           __html: "&nbsp;"
         }
-      }) : /*#__PURE__*/React__default['default'].createElement("span", {
+      }) : /*#__PURE__*/React__default["default"].createElement("span", {
         className: labelClassName
       }, this.chooseButtonLabel());
-      return /*#__PURE__*/React__default['default'].createElement("span", {
+      return /*#__PURE__*/React__default["default"].createElement("span", {
         className: chooseClassName,
         style: style,
         onClick: this.choose,
@@ -608,7 +611,7 @@ var FileUpload = /*#__PURE__*/function (_Component) {
         onFocus: this.onFocus,
         onBlur: this.onBlur,
         tabIndex: 0
-      }, /*#__PURE__*/React__default['default'].createElement("input", {
+      }, /*#__PURE__*/React__default["default"].createElement("input", {
         ref: function ref(el) {
           return _this4.fileInput = el;
         },
@@ -617,33 +620,35 @@ var FileUpload = /*#__PURE__*/function (_Component) {
         multiple: this.props.multiple,
         accept: this.props.accept,
         disabled: this.chooseDisabled()
-      }), /*#__PURE__*/React__default['default'].createElement("span", {
-        className: chooseIconClassName
-      }), label, /*#__PURE__*/React__default['default'].createElement(core.Ripple, null));
+      }), utils.IconUtils.getJSXIcon(icon || 'pi pi-fw pi-plus', {
+        className: 'p-button-icon p-button-icon-left p-clickable'
+      }, {
+        props: this.props
+      }), label, /*#__PURE__*/React__default["default"].createElement(ripple.Ripple, null));
     }
   }, {
     key: "renderFile",
     value: function renderFile(file, index) {
       var _this5 = this;
 
-      var preview = this.isImage(file) ? /*#__PURE__*/React__default['default'].createElement("div", null, /*#__PURE__*/React__default['default'].createElement("img", {
+      var preview = this.isImage(file) ? /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement("img", {
         alt: file.name,
         role: "presentation",
         src: file.objectURL,
         width: this.props.previewWidth
       })) : null;
-      var fileName = /*#__PURE__*/React__default['default'].createElement("div", {
+      var fileName = /*#__PURE__*/React__default["default"].createElement("div", {
         className: "p-fileupload-filename"
       }, file.name);
-      var size = /*#__PURE__*/React__default['default'].createElement("div", null, this.formatSize(file.size));
-      var removeButton = /*#__PURE__*/React__default['default'].createElement("div", null, /*#__PURE__*/React__default['default'].createElement(button.Button, {
+      var size = /*#__PURE__*/React__default["default"].createElement("div", null, this.formatSize(file.size));
+      var removeButton = /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement(button.Button, {
         type: "button",
         icon: "pi pi-times",
         onClick: function onClick(e) {
           return _this5.remove(e, index);
         }
       }));
-      var content = /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, preview, fileName, size, removeButton);
+      var content = /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, preview, fileName, size, removeButton);
 
       if (this.props.itemTemplate) {
         var defaultContentOptions = {
@@ -658,10 +663,10 @@ var FileUpload = /*#__PURE__*/function (_Component) {
           element: content,
           props: this.props
         };
-        content = core.ObjectUtils.getJSXElement(this.props.itemTemplate, file, defaultContentOptions);
+        content = utils.ObjectUtils.getJSXElement(this.props.itemTemplate, file, defaultContentOptions);
       }
 
-      return /*#__PURE__*/React__default['default'].createElement("div", {
+      return /*#__PURE__*/React__default["default"].createElement("div", {
         className: "p-fileupload-row",
         key: file.name + file.type + file.size
       }, content);
@@ -671,7 +676,7 @@ var FileUpload = /*#__PURE__*/function (_Component) {
     value: function renderFiles() {
       var _this6 = this;
 
-      return /*#__PURE__*/React__default['default'].createElement("div", {
+      return /*#__PURE__*/React__default["default"].createElement("div", {
         className: "p-fileupload-files"
       }, this.state.files.map(function (file, index) {
         return _this6.renderFile(file, index);
@@ -681,7 +686,7 @@ var FileUpload = /*#__PURE__*/function (_Component) {
     key: "renderEmptyContent",
     value: function renderEmptyContent() {
       if (this.props.emptyTemplate && !this.hasFiles()) {
-        return core.ObjectUtils.getJSXElement(this.props.emptyTemplate, this.props);
+        return utils.ObjectUtils.getJSXElement(this.props.emptyTemplate, this.props);
       }
 
       return null;
@@ -690,10 +695,10 @@ var FileUpload = /*#__PURE__*/function (_Component) {
     key: "renderProgressBarContent",
     value: function renderProgressBarContent() {
       if (this.props.progressBarTemplate) {
-        return core.ObjectUtils.getJSXElement(this.props.progressBarTemplate, this.props);
+        return utils.ObjectUtils.getJSXElement(this.props.progressBarTemplate, this.props);
       }
 
-      return /*#__PURE__*/React__default['default'].createElement(progressbar.ProgressBar, {
+      return /*#__PURE__*/React__default["default"].createElement(progressbar.ProgressBar, {
         value: this.state.progress,
         showValue: false
       });
@@ -703,9 +708,9 @@ var FileUpload = /*#__PURE__*/function (_Component) {
     value: function renderAdvanced() {
       var _this7 = this;
 
-      var className = core.classNames('p-fileupload p-fileupload-advanced p-component', this.props.className);
-      var headerClassName = core.classNames('p-fileupload-buttonbar', this.props.headerClassName);
-      var contentClassName = core.classNames('p-fileupload-content', this.props.contentClassName);
+      var className = utils.classNames('p-fileupload p-fileupload-advanced p-component', this.props.className);
+      var headerClassName = utils.classNames('p-fileupload-buttonbar', this.props.headerClassName);
+      var contentClassName = utils.classNames('p-fileupload-content', this.props.contentClassName);
       var uploadButton, cancelButton, filesList, progressBar;
       var chooseButton = this.renderChooseButton();
       var emptyContent = this.renderEmptyContent();
@@ -715,7 +720,7 @@ var FileUpload = /*#__PURE__*/function (_Component) {
         var cancelOptions = this.props.cancelOptions;
         var uploadLabel = !uploadOptions.iconOnly ? this.uploadButtonLabel() : '';
         var cancelLabel = !cancelOptions.iconOnly ? this.cancelButtonLabel() : '';
-        uploadButton = /*#__PURE__*/React__default['default'].createElement(button.Button, {
+        uploadButton = /*#__PURE__*/React__default["default"].createElement(button.Button, {
           type: "button",
           label: uploadLabel,
           icon: uploadOptions.icon || 'pi pi-upload',
@@ -724,7 +729,7 @@ var FileUpload = /*#__PURE__*/function (_Component) {
           style: uploadOptions.style,
           className: uploadOptions.className
         });
-        cancelButton = /*#__PURE__*/React__default['default'].createElement(button.Button, {
+        cancelButton = /*#__PURE__*/React__default["default"].createElement(button.Button, {
           type: "button",
           label: cancelLabel,
           icon: cancelOptions.icon || 'pi pi-times',
@@ -740,7 +745,7 @@ var FileUpload = /*#__PURE__*/function (_Component) {
         progressBar = this.renderProgressBarContent();
       }
 
-      var header = /*#__PURE__*/React__default['default'].createElement("div", {
+      var header = /*#__PURE__*/React__default["default"].createElement("div", {
         className: headerClassName,
         style: this.props.headerStyle
       }, chooseButton, uploadButton, cancelButton);
@@ -754,14 +759,14 @@ var FileUpload = /*#__PURE__*/function (_Component) {
           element: header,
           props: this.props
         };
-        header = core.ObjectUtils.getJSXElement(this.props.headerTemplate, defaultContentOptions);
+        header = utils.ObjectUtils.getJSXElement(this.props.headerTemplate, defaultContentOptions);
       }
 
-      return /*#__PURE__*/React__default['default'].createElement("div", {
+      return /*#__PURE__*/React__default["default"].createElement("div", {
         id: this.props.id,
         className: className,
         style: this.props.style
-      }, header, /*#__PURE__*/React__default['default'].createElement("div", {
+      }, header, /*#__PURE__*/React__default["default"].createElement("div", {
         ref: function ref(el) {
           _this7.content = el;
         },
@@ -771,7 +776,7 @@ var FileUpload = /*#__PURE__*/function (_Component) {
         onDragOver: this.onDragOver,
         onDragLeave: this.onDragLeave,
         onDrop: this.onDrop
-      }, progressBar, /*#__PURE__*/React__default['default'].createElement(messages.Messages, {
+      }, progressBar, /*#__PURE__*/React__default["default"].createElement(messages.Messages, {
         ref: function ref(el) {
           return _this7.messagesUI = el;
         }
@@ -782,40 +787,44 @@ var FileUpload = /*#__PURE__*/function (_Component) {
     value: function renderBasic() {
       var _this8 = this;
 
+      var hasFiles = this.hasFiles();
       var chooseOptions = this.props.chooseOptions;
-      var className = core.classNames('p-fileupload p-fileupload-basic p-component', this.props.className);
-      var buttonClassName = core.classNames('p-button p-component p-fileupload-choose', {
-        'p-fileupload-choose-selected': this.hasFiles(),
+      var className = utils.classNames('p-fileupload p-fileupload-basic p-component', this.props.className);
+      var buttonClassName = utils.classNames('p-button p-component p-fileupload-choose', {
+        'p-fileupload-choose-selected': hasFiles,
         'p-disabled': this.props.disabled,
         'p-focus': this.state.focused
       }, chooseOptions.className);
-      var iconClassName = core.classNames('p-button-icon p-button-icon-left pi', {
-        'pi-plus': !chooseOptions.icon && (!this.hasFiles() || this.props.auto),
-        'pi-upload': !chooseOptions.icon && this.hasFiles() && !this.props.auto
-      }, chooseOptions.icon);
+      var chooseIcon = chooseOptions.icon || utils.classNames({
+        'pi pi-plus': !chooseOptions.icon && (!hasFiles || this.props.auto),
+        'pi pi-upload': !chooseOptions.icon && hasFiles && !this.props.auto
+      });
       var labelClassName = 'p-button-label p-clickable';
-      var chooseLabel = chooseOptions.iconOnly ? /*#__PURE__*/React__default['default'].createElement("span", {
+      var chooseLabel = chooseOptions.iconOnly ? /*#__PURE__*/React__default["default"].createElement("span", {
         className: labelClassName,
         dangerouslySetInnerHTML: {
           __html: "&nbsp;"
         }
-      }) : /*#__PURE__*/React__default['default'].createElement("span", {
+      }) : /*#__PURE__*/React__default["default"].createElement("span", {
         className: labelClassName
       }, this.chooseButtonLabel());
-      var label = this.props.auto ? chooseLabel : /*#__PURE__*/React__default['default'].createElement("span", {
+      var label = this.props.auto ? chooseLabel : /*#__PURE__*/React__default["default"].createElement("span", {
         className: labelClassName
-      }, this.hasFiles() ? this.state.files[0].name : chooseLabel);
-      var icon = /*#__PURE__*/React__default['default'].createElement("span", {
-        className: iconClassName
+      }, hasFiles ? this.state.files[0].name : chooseLabel);
+      var icon = utils.IconUtils.getJSXIcon(chooseIcon, {
+        className: 'p-button-icon p-button-icon-left'
+      }, {
+        props: this.props,
+        hasFiles: hasFiles
       });
-      return /*#__PURE__*/React__default['default'].createElement("div", {
+      return /*#__PURE__*/React__default["default"].createElement("div", {
         className: className,
         style: this.props.style
-      }, /*#__PURE__*/React__default['default'].createElement(messages.Messages, {
+      }, /*#__PURE__*/React__default["default"].createElement(messages.Messages, {
         ref: function ref(el) {
           return _this8.messagesUI = el;
         }
-      }), /*#__PURE__*/React__default['default'].createElement("span", {
+      }), /*#__PURE__*/React__default["default"].createElement("span", {
         className: buttonClassName,
         style: chooseOptions.style,
         onMouseUp: this.onSimpleUploaderClick,
@@ -823,7 +832,7 @@ var FileUpload = /*#__PURE__*/function (_Component) {
         onFocus: this.onFocus,
         onBlur: this.onBlur,
         tabIndex: 0
-      }, icon, label, !this.hasFiles() && /*#__PURE__*/React__default['default'].createElement("input", {
+      }, icon, label, !hasFiles && /*#__PURE__*/React__default["default"].createElement("input", {
         ref: function ref(el) {
           return _this8.fileInput = el;
         },
@@ -832,7 +841,7 @@ var FileUpload = /*#__PURE__*/function (_Component) {
         multiple: this.props.multiple,
         disabled: this.props.disabled,
         onChange: this.onFileSelect
-      }), /*#__PURE__*/React__default['default'].createElement(core.Ripple, null)));
+      }), /*#__PURE__*/React__default["default"].createElement(ripple.Ripple, null)));
     }
   }, {
     key: "render",

package/fileupload/fileupload.cjs.min.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("primereact/button"),n=require("primereact/messages"),l=require("primereact/progressbar"),s=require("primereact/core"),o=require("primereact/api");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var i=a(e);function r(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,l=new Array(t);n<t;n++)l[n]=e[n];return l}function p(e){if(Array.isArray(e))return r(e)}function u(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}function c(e,t){if(e){if("string"==typeof e)return r(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)?r(e,t):void 0}}function h(){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 f(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function d(e,t){for(var n=0;n<t.length;n++){var l=t[n];l.enumerable=l.enumerable||!1,l.configurable=!0,"value"in l&&(l.writable=!0),Object.defineProperty(e,l.key,l)}}function m(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}function y(e,t){return(y=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e})(e,t)}function v(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}}),t&&y(e,t)}function b(e){return(b="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})(e)}function g(e,t){return!t||"object"!==b(t)&&"function"!=typeof t?m(e):t}function E(e){return(E=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)})(e)}function S(e,t){var n="undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(!n){if(Array.isArray(e)||(n=k(e))||t&&e&&"number"==typeof e.length){n&&(e=n);var l=0,s=function(){};return{s:s,n:function(){return l>=e.length?{done:!0}:{done:!1,value:e[l++]}},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 o,a=!0,i=!1;return{s:function(){n=n.call(e)},n:function(){var e=n.next();return a=e.done,e},e:function(e){i=!0,o=e},f:function(){try{a||null==n.return||n.return()}finally{if(i)throw o}}}}function k(e,t){if(e){if("string"==typeof e)return F(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)?F(e,t):void 0}}function F(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,l=new Array(t);n<t;n++)l[n]=e[n];return l}function B(){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 O,D,w,I=function(a){v(D,e.Component);var r,y,b,k,F,O=(r=D,y=B(),function(){var e,t=E(r);if(y){var n=E(this).constructor;e=Reflect.construct(t,arguments,n)}else e=t.apply(this,arguments);return g(this,e)});function D(e){var t;return f(this,D),(t=O.call(this,e)).state={files:[],msgs:[],focused:!1},t.choose=t.choose.bind(m(t)),t.upload=t.upload.bind(m(t)),t.clear=t.clear.bind(m(t)),t.onFileSelect=t.onFileSelect.bind(m(t)),t.onDragEnter=t.onDragEnter.bind(m(t)),t.onDragOver=t.onDragOver.bind(m(t)),t.onDragLeave=t.onDragLeave.bind(m(t)),t.onDrop=t.onDrop.bind(m(t)),t.onKeyDown=t.onKeyDown.bind(m(t)),t.onFocus=t.onFocus.bind(m(t)),t.onBlur=t.onBlur.bind(m(t)),t.onSimpleUploaderClick=t.onSimpleUploaderClick.bind(m(t)),t.duplicateIEEvent=!1,t}return b=D,(k=[{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||o.localeOption("choose")}},{key:"uploadButtonLabel",value:function(){return this.props.uploadLabel||this.props.uploadOptions.label||o.localeOption("upload")}},{key:"cancelButtonLabel",value:function(){return this.props.cancelLabel||this.props.cancelOptions.label||o.localeOption("cancel")}},{key:"remove",value:function(e,t){this.clearInputElement();var n,l=p(n=this.state.files)||u(n)||c(n)||h(),s=this.state.files[t];l.splice(t,1),this.setState({files:l}),this.props.onRemove&&this.props.onRemove({originalEvent:e,file:s})}},{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||[];for(var n=e.dataTransfer?e.dataTransfer.files:e.target.files,l=0;l<n.length;l++){var s=n[l];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=S(this.state.files);try{for(n.s();!(t=n.n()).done;){var l=t.value;if(l.name+l.type+l.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 l,s=S(this.state.files);try{for(s.s();!(l=s.n()).done;){var o=l.value;n.append(this.props.name,o,o.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.stopPropagation(),e.preventDefault())}},{key:"onDragOver",value:function(e){this.props.disabled||(s.DomHandler.addClass(this.content,"p-fileupload-highlight"),e.stopPropagation(),e.preventDefault())}},{key:"onDragLeave",value:function(e){this.props.disabled||s.DomHandler.removeClass(this.content,"p-fileupload-highlight")}},{key:"onDrop",value:function(e){if(!this.props.disabled){s.DomHandler.removeClass(this.content,"p-fileupload-highlight"),e.stopPropagation(),e.preventDefault();var t=e.dataTransfer?e.dataTransfer.files:e.target.files;(this.props.multiple||t&&1===t.length)&&this.onFileSelect(e)}}},{key:"onSimpleUploaderClick",value:function(){this.hasFiles()?this.upload():this.fileInput.click()}},{key:"renderChooseButton",value:function(){var e=this,t=this.props.chooseOptions,n=t.style,l=t.icon,o=t.iconOnly,a=s.classNames("p-button p-fileupload-choose p-component",{"p-disabled":this.props.disabled,"p-focus":this.state.focused,"p-button-icon-only":o},t.className),r=s.classNames("p-button-icon p-button-icon-left p-clickable",{"pi pi-fw pi-plus":!l},l),p="p-button-label p-clickable",u=o?i.default.createElement("span",{className:p,dangerouslySetInnerHTML:{__html:"&nbsp;"}}):i.default.createElement("span",{className:p},this.chooseButtonLabel());return i.default.createElement("span",{className:a,style:n,onClick:this.choose,onKeyDown:this.onKeyDown,onFocus:this.onFocus,onBlur:this.onBlur,tabIndex:0},i.default.createElement("input",{ref:function(t){return e.fileInput=t},type:"file",onChange:this.onFileSelect,multiple:this.props.multiple,accept:this.props.accept,disabled:this.chooseDisabled()}),i.default.createElement("span",{className:r}),u,i.default.createElement(s.Ripple,null))}},{key:"renderFile",value:function(e,n){var l=this,o=this.isImage(e)?i.default.createElement("div",null,i.default.createElement("img",{alt:e.name,role:"presentation",src:e.objectURL,width:this.props.previewWidth})):null,a=i.default.createElement("div",{className:"p-fileupload-filename"},e.name),r=i.default.createElement("div",null,this.formatSize(e.size)),p=i.default.createElement("div",null,i.default.createElement(t.Button,{type:"button",icon:"pi pi-times",onClick:function(e){return l.remove(e,n)}})),u=i.default.createElement(i.default.Fragment,null,o,a,r,p);if(this.props.itemTemplate){var c={onRemove:function(e){return l.remove(e,n)},previewElement:o,fileNameElement:a,sizeElement:r,removeElement:p,formatSize:this.formatSize(e.size),element:u,props:this.props};u=s.ObjectUtils.getJSXElement(this.props.itemTemplate,e,c)}return i.default.createElement("div",{className:"p-fileupload-row",key:e.name+e.type+e.size},u)}},{key:"renderFiles",value:function(){var e=this;return i.default.createElement("div",{className:"p-fileupload-files"},this.state.files.map((function(t,n){return e.renderFile(t,n)})))}},{key:"renderEmptyContent",value:function(){return this.props.emptyTemplate&&!this.hasFiles()?s.ObjectUtils.getJSXElement(this.props.emptyTemplate,this.props):null}},{key:"renderProgressBarContent",value:function(){return this.props.progressBarTemplate?s.ObjectUtils.getJSXElement(this.props.progressBarTemplate,this.props):i.default.createElement(l.ProgressBar,{value:this.state.progress,showValue:!1})}},{key:"renderAdvanced",value:function(){var e,l,o,a,r=this,p=s.classNames("p-fileupload p-fileupload-advanced p-component",this.props.className),u=s.classNames("p-fileupload-buttonbar",this.props.headerClassName),c=s.classNames("p-fileupload-content",this.props.contentClassName),h=this.renderChooseButton(),f=this.renderEmptyContent();if(!this.props.auto){var d=this.props.uploadOptions,m=this.props.cancelOptions,y=d.iconOnly?"":this.uploadButtonLabel(),v=m.iconOnly?"":this.cancelButtonLabel();e=i.default.createElement(t.Button,{type:"button",label:y,icon:d.icon||"pi pi-upload",onClick:this.upload,disabled:this.uploadDisabled(),style:d.style,className:d.className}),l=i.default.createElement(t.Button,{type:"button",label:v,icon:m.icon||"pi pi-times",onClick:this.clear,disabled:this.cancelDisabled(),style:m.style,className:m.className})}this.hasFiles()&&(o=this.renderFiles(),a=this.renderProgressBarContent());var b=i.default.createElement("div",{className:u,style:this.props.headerStyle},h,e,l);return this.props.headerTemplate&&(b=s.ObjectUtils.getJSXElement(this.props.headerTemplate,{className:u,chooseButton:h,uploadButton:e,cancelButton:l,element:b,props:this.props})),i.default.createElement("div",{id:this.props.id,className:p,style:this.props.style},b,i.default.createElement("div",{ref:function(e){r.content=e},className:c,style:this.props.contentStyle,onDragEnter:this.onDragEnter,onDragOver:this.onDragOver,onDragLeave:this.onDragLeave,onDrop:this.onDrop},a,i.default.createElement(n.Messages,{ref:function(e){return r.messagesUI=e}}),o,f))}},{key:"renderBasic",value:function(){var e=this,t=this.props.chooseOptions,l=s.classNames("p-fileupload p-fileupload-basic p-component",this.props.className),o=s.classNames("p-button p-component p-fileupload-choose",{"p-fileupload-choose-selected":this.hasFiles(),"p-disabled":this.props.disabled,"p-focus":this.state.focused},t.className),a=s.classNames("p-button-icon p-button-icon-left pi",{"pi-plus":!t.icon&&(!this.hasFiles()||this.props.auto),"pi-upload":!t.icon&&this.hasFiles()&&!this.props.auto},t.icon),r="p-button-label p-clickable",p=t.iconOnly?i.default.createElement("span",{className:r,dangerouslySetInnerHTML:{__html:"&nbsp;"}}):i.default.createElement("span",{className:r},this.chooseButtonLabel()),u=this.props.auto?p:i.default.createElement("span",{className:r},this.hasFiles()?this.state.files[0].name:p),c=i.default.createElement("span",{className:a});return i.default.createElement("div",{className:l,style:this.props.style},i.default.createElement(n.Messages,{ref:function(t){return e.messagesUI=t}}),i.default.createElement("span",{className:o,style:t.style,onMouseUp:this.onSimpleUploaderClick,onKeyDown:this.onKeyDown,onFocus:this.onFocus,onBlur:this.onBlur,tabIndex:0},c,u,!this.hasFiles()&&i.default.createElement("input",{ref:function(t){return e.fileInput=t},type:"file",accept:this.props.accept,multiple:this.props.multiple,disabled:this.props.disabled,onChange:this.onFileSelect}),i.default.createElement(s.Ripple,null)))}},{key:"render",value:function(){return"advanced"===this.props.mode?this.renderAdvanced():"basic"===this.props.mode?this.renderBasic():void 0}}])&&d(b.prototype,k),F&&d(b,F),D}();w={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},(D="defaultProps")in(O=I)?Object.defineProperty(O,D,{value:w,enumerable:!0,configurable:!0,writable:!0}):O[D]=w,exports.FileUpload=I;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("primereact/button"),n=require("primereact/messages"),o=require("primereact/progressbar"),l=require("primereact/utils"),s=require("primereact/ripple"),i=require("primereact/api");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r=a(e);function p(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 u(e){if(Array.isArray(e))return p(e)}function c(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}function f(e,t){if(e){if("string"==typeof e)return p(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)?p(e,t):void 0}}function d(){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 h(e){return u(e)||c(e)||f(e)||d()}function m(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function y(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 v(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}function b(e,t){return b=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e},b(e,t)}function g(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}}),t&&b(e,t)}function E(e){return E="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},E(e)}function S(e,t){if(t&&("object"===E(t)||"function"==typeof t))return t;if(void 0!==t)throw new TypeError("Derived constructors may only return object or undefined");return v(e)}function k(e){return k=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)},k(e)}function B(e,t){var n="undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(!n){if(Array.isArray(e)||(n=O(e))||t&&e&&"number"==typeof e.length){n&&(e=n);var o=0,l=function(){};return{s:l,n:function(){return o>=e.length?{done:!0}:{done:!1,value:e[o++]}},e:function(e){throw e},f:l}}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 s,i=!0,a=!1;return{s:function(){n=n.call(e)},n:function(){var e=n.next();return i=e.done,e},e:function(e){a=!0,s=e},f:function(){try{i||null==n.return||n.return()}finally{if(a)throw s}}}}function O(e,t){if(e){if("string"==typeof e)return F(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)?F(e,t):void 0}}function F(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 I(){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 w,D,N,C=function(a){g(E,e.Component);var p,u,c,f,d,b=(p=E,u=I(),function(){var e,t=k(p);if(u){var n=k(this).constructor;e=Reflect.construct(t,arguments,n)}else e=t.apply(this,arguments);return S(this,e)});function E(e){var t;return m(this,E),(t=b.call(this,e)).state={files:[],msgs:[],focused:!1},t.choose=t.choose.bind(v(t)),t.upload=t.upload.bind(v(t)),t.clear=t.clear.bind(v(t)),t.onFileSelect=t.onFileSelect.bind(v(t)),t.onDragEnter=t.onDragEnter.bind(v(t)),t.onDragOver=t.onDragOver.bind(v(t)),t.onDragLeave=t.onDragLeave.bind(v(t)),t.onDrop=t.onDrop.bind(v(t)),t.onKeyDown=t.onKeyDown.bind(v(t)),t.onFocus=t.onFocus.bind(v(t)),t.onBlur=t.onBlur.bind(v(t)),t.onSimpleUploaderClick=t.onSimpleUploaderClick.bind(v(t)),t.duplicateIEEvent=!1,t}return c=E,(f=[{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||i.localeOption("choose")}},{key:"uploadButtonLabel",value:function(){return this.props.uploadLabel||this.props.uploadOptions.label||i.localeOption("upload")}},{key:"cancelButtonLabel",value:function(){return this.props.cancelLabel||this.props.cancelOptions.label||i.localeOption("cancel")}},{key:"remove",value:function(e,t){this.clearInputElement();var n=h(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?h(this.state.files):[];for(var n=e.dataTransfer?e.dataTransfer.files:e.target.files,o=0;o<n.length;o++){var l=n[o];this.isFileSelected(l)||this.validate(l)&&(this.isImage(l)&&(l.objectURL=window.URL.createObjectURL(l)),this.files.push(l))}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,l=B(this.state.files);try{for(l.s();!(o=l.n()).done;){var s=o.value;n.append(this.props.name,s,s.name)}}catch(e){l.e(e)}finally{l.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",l.DomHandler.addClass(this.content,"p-fileupload-highlight"),e.stopPropagation(),e.preventDefault())}},{key:"onDragLeave",value:function(e){this.props.disabled||(e.dataTransfer.dropEffect="copy",l.DomHandler.removeClass(this.content,"p-fileupload-highlight"))}},{key:"onDrop",value:function(e){if(!this.props.disabled){l.DomHandler.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 e=this,t=this.props.chooseOptions,n=t.style,o=t.icon,i=t.iconOnly,a=l.classNames("p-button p-fileupload-choose p-component",{"p-disabled":this.props.disabled,"p-focus":this.state.focused,"p-button-icon-only":i},t.className),p="p-button-label p-clickable",u=i?r.default.createElement("span",{className:p,dangerouslySetInnerHTML:{__html:"&nbsp;"}}):r.default.createElement("span",{className:p},this.chooseButtonLabel());return r.default.createElement("span",{className:a,style:n,onClick:this.choose,onKeyDown:this.onKeyDown,onFocus:this.onFocus,onBlur:this.onBlur,tabIndex:0},r.default.createElement("input",{ref:function(t){return e.fileInput=t},type:"file",onChange:this.onFileSelect,multiple:this.props.multiple,accept:this.props.accept,disabled:this.chooseDisabled()}),l.IconUtils.getJSXIcon(o||"pi pi-fw pi-plus",{className:"p-button-icon p-button-icon-left p-clickable"},{props:this.props}),u,r.default.createElement(s.Ripple,null))}},{key:"renderFile",value:function(e,n){var o=this,s=this.isImage(e)?r.default.createElement("div",null,r.default.createElement("img",{alt:e.name,role:"presentation",src:e.objectURL,width:this.props.previewWidth})):null,i=r.default.createElement("div",{className:"p-fileupload-filename"},e.name),a=r.default.createElement("div",null,this.formatSize(e.size)),p=r.default.createElement("div",null,r.default.createElement(t.Button,{type:"button",icon:"pi pi-times",onClick:function(e){return o.remove(e,n)}})),u=r.default.createElement(r.default.Fragment,null,s,i,a,p);if(this.props.itemTemplate){var c={onRemove:function(e){return o.remove(e,n)},previewElement:s,fileNameElement:i,sizeElement:a,removeElement:p,formatSize:this.formatSize(e.size),element:u,props:this.props};u=l.ObjectUtils.getJSXElement(this.props.itemTemplate,e,c)}return r.default.createElement("div",{className:"p-fileupload-row",key:e.name+e.type+e.size},u)}},{key:"renderFiles",value:function(){var e=this;return r.default.createElement("div",{className:"p-fileupload-files"},this.state.files.map((function(t,n){return e.renderFile(t,n)})))}},{key:"renderEmptyContent",value:function(){return this.props.emptyTemplate&&!this.hasFiles()?l.ObjectUtils.getJSXElement(this.props.emptyTemplate,this.props):null}},{key:"renderProgressBarContent",value:function(){return this.props.progressBarTemplate?l.ObjectUtils.getJSXElement(this.props.progressBarTemplate,this.props):r.default.createElement(o.ProgressBar,{value:this.state.progress,showValue:!1})}},{key:"renderAdvanced",value:function(){var e,o,s,i,a=this,p=l.classNames("p-fileupload p-fileupload-advanced p-component",this.props.className),u=l.classNames("p-fileupload-buttonbar",this.props.headerClassName),c=l.classNames("p-fileupload-content",this.props.contentClassName),f=this.renderChooseButton(),d=this.renderEmptyContent();if(!this.props.auto){var h=this.props.uploadOptions,m=this.props.cancelOptions,y=h.iconOnly?"":this.uploadButtonLabel(),v=m.iconOnly?"":this.cancelButtonLabel();e=r.default.createElement(t.Button,{type:"button",label:y,icon:h.icon||"pi pi-upload",onClick:this.upload,disabled:this.uploadDisabled(),style:h.style,className:h.className}),o=r.default.createElement(t.Button,{type:"button",label:v,icon:m.icon||"pi pi-times",onClick:this.clear,disabled:this.cancelDisabled(),style:m.style,className:m.className})}this.hasFiles()&&(s=this.renderFiles(),i=this.renderProgressBarContent());var b=r.default.createElement("div",{className:u,style:this.props.headerStyle},f,e,o);return this.props.headerTemplate&&(b=l.ObjectUtils.getJSXElement(this.props.headerTemplate,{className:u,chooseButton:f,uploadButton:e,cancelButton:o,element:b,props:this.props})),r.default.createElement("div",{id:this.props.id,className:p,style:this.props.style},b,r.default.createElement("div",{ref:function(e){a.content=e},className:c,style:this.props.contentStyle,onDragEnter:this.onDragEnter,onDragOver:this.onDragOver,onDragLeave:this.onDragLeave,onDrop:this.onDrop},i,r.default.createElement(n.Messages,{ref:function(e){return a.messagesUI=e}}),s,d))}},{key:"renderBasic",value:function(){var e=this,t=this.hasFiles(),o=this.props.chooseOptions,i=l.classNames("p-fileupload p-fileupload-basic p-component",this.props.className),a=l.classNames("p-button p-component p-fileupload-choose",{"p-fileupload-choose-selected":t,"p-disabled":this.props.disabled,"p-focus":this.state.focused},o.className),p=o.icon||l.classNames({"pi pi-plus":!o.icon&&(!t||this.props.auto),"pi pi-upload":!o.icon&&t&&!this.props.auto}),u="p-button-label p-clickable",c=o.iconOnly?r.default.createElement("span",{className:u,dangerouslySetInnerHTML:{__html:"&nbsp;"}}):r.default.createElement("span",{className:u},this.chooseButtonLabel()),f=this.props.auto?c:r.default.createElement("span",{className:u},t?this.state.files[0].name:c),d=l.IconUtils.getJSXIcon(p,{className:"p-button-icon p-button-icon-left"},{props:this.props,hasFiles:t});return r.default.createElement("div",{className:i,style:this.props.style},r.default.createElement(n.Messages,{ref:function(t){return e.messagesUI=t}}),r.default.createElement("span",{className:a,style:o.style,onMouseUp:this.onSimpleUploaderClick,onKeyDown:this.onKeyDown,onFocus:this.onFocus,onBlur:this.onBlur,tabIndex:0},d,f,!t&&r.default.createElement("input",{ref:function(t){return e.fileInput=t},type:"file",accept:this.props.accept,multiple:this.props.multiple,disabled:this.props.disabled,onChange:this.onFileSelect}),r.default.createElement(s.Ripple,null)))}},{key:"render",value:function(){return"advanced"===this.props.mode?this.renderAdvanced():"basic"===this.props.mode?this.renderBasic():void 0}}])&&y(c.prototype,f),d&&y(c,d),E}();N={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},(D="defaultProps")in(w=C)?Object.defineProperty(w,D,{value:N,enumerable:!0,configurable:!0,writable:!0}):w[D]=N,exports.FileUpload=C;

package/fileupload/fileupload.d.ts

@@ -1,10 +1,11 @@
 import * as React from 'react';
+import {IconType} from "../utils/Utils";
 
 type FileUploadModeType = 'basic' | 'advanced';
 
 interface FileUploadOptionsType {
     label?: string;
-    icon?: string;
+    icon?: IconType<FileUploadProps>;
     iconOnly?: boolean;
     className?: string;
     style?: object

package/fileupload/fileupload.esm.js

@@ -2,7 +2,8 @@ import React, { Component } from 'react';
 import { Button } from 'primereact/button';
 import { Messages } from 'primereact/messages';
 import { ProgressBar } from 'primereact/progressbar';
-import { DomHandler, classNames, Ripple, ObjectUtils } from 'primereact/core';
+import { DomHandler, classNames, IconUtils, ObjectUtils } from 'primereact/utils';
+import { Ripple } from 'primereact/ripple';
 import { localeOption } from 'primereact/api';
 
 function _arrayLikeToArray$1(arr, len) {
@@ -113,6 +114,8 @@ function _typeof(obj) {
 function _possibleConstructorReturn(self, call) {
   if (call && (_typeof(call) === "object" || typeof call === "function")) {
     return call;
+  } else if (call !== void 0) {
+    throw new TypeError("Derived constructors may only return object or undefined");
   }
 
   return _assertThisInitialized(self);
@@ -283,7 +286,7 @@ var FileUpload = /*#__PURE__*/function (_Component) {
       this.setState({
         msgs: []
       });
-      this.files = this.state.files || [];
+      this.files = this.state.files ? _toConsumableArray(this.state.files) : [];
       var files = event.dataTransfer ? event.dataTransfer.files : event.target.files;
 
       for (var i = 0; i < files.length; i++) {
@@ -521,6 +524,7 @@ var FileUpload = /*#__PURE__*/function (_Component) {
     key: "onDragEnter",
     value: function onDragEnter(event) {
       if (!this.props.disabled) {
+        event.dataTransfer.dropEffect = "copy";
         event.stopPropagation();
         event.preventDefault();
       }
@@ -529,6 +533,7 @@ var FileUpload = /*#__PURE__*/function (_Component) {
     key: "onDragOver",
     value: function onDragOver(event) {
       if (!this.props.disabled) {
+        event.dataTransfer.dropEffect = "copy";
         DomHandler.addClass(this.content, 'p-fileupload-highlight');
         event.stopPropagation();
         event.preventDefault();
@@ -538,6 +543,7 @@ var FileUpload = /*#__PURE__*/function (_Component) {
     key: "onDragLeave",
     value: function onDragLeave(event) {
       if (!this.props.disabled) {
+        event.dataTransfer.dropEffect = "copy";
         DomHandler.removeClass(this.content, 'p-fileupload-highlight');
       }
     }
@@ -549,7 +555,7 @@ var FileUpload = /*#__PURE__*/function (_Component) {
         event.stopPropagation();
         event.preventDefault();
         var files = event.dataTransfer ? event.dataTransfer.files : event.target.files;
-        var allowDrop = this.props.multiple || files && files.length === 1;
+        var allowDrop = this.props.multiple || files && files.length === 0;
 
         if (allowDrop) {
           this.onFileSelect(event);
@@ -580,9 +586,6 @@ var FileUpload = /*#__PURE__*/function (_Component) {
         'p-focus': this.state.focused,
         'p-button-icon-only': iconOnly
       }, className);
-      var chooseIconClassName = classNames('p-button-icon p-button-icon-left p-clickable', {
-        'pi pi-fw pi-plus': !icon
-      }, icon);
       var labelClassName = 'p-button-label p-clickable';
       var label = iconOnly ? /*#__PURE__*/React.createElement("span", {
         className: labelClassName,
@@ -609,8 +612,10 @@ var FileUpload = /*#__PURE__*/function (_Component) {
         multiple: this.props.multiple,
         accept: this.props.accept,
         disabled: this.chooseDisabled()
-      }), /*#__PURE__*/React.createElement("span", {
-        className: chooseIconClassName
+      }), IconUtils.getJSXIcon(icon || 'pi pi-fw pi-plus', {
+        className: 'p-button-icon p-button-icon-left p-clickable'
+      }, {
+        props: this.props
       }), label, /*#__PURE__*/React.createElement(Ripple, null));
     }
   }, {
@@ -774,17 +779,18 @@ var FileUpload = /*#__PURE__*/function (_Component) {
     value: function renderBasic() {
       var _this8 = this;
 
+      var hasFiles = this.hasFiles();
       var chooseOptions = this.props.chooseOptions;
       var className = classNames('p-fileupload p-fileupload-basic p-component', this.props.className);
       var buttonClassName = classNames('p-button p-component p-fileupload-choose', {
-        'p-fileupload-choose-selected': this.hasFiles(),
+        'p-fileupload-choose-selected': hasFiles,
         'p-disabled': this.props.disabled,
         'p-focus': this.state.focused
       }, chooseOptions.className);
-      var iconClassName = classNames('p-button-icon p-button-icon-left pi', {
-        'pi-plus': !chooseOptions.icon && (!this.hasFiles() || this.props.auto),
-        'pi-upload': !chooseOptions.icon && this.hasFiles() && !this.props.auto
-      }, chooseOptions.icon);
+      var chooseIcon = chooseOptions.icon || classNames({
+        'pi pi-plus': !chooseOptions.icon && (!hasFiles || this.props.auto),
+        'pi pi-upload': !chooseOptions.icon && hasFiles && !this.props.auto
+      });
       var labelClassName = 'p-button-label p-clickable';
       var chooseLabel = chooseOptions.iconOnly ? /*#__PURE__*/React.createElement("span", {
         className: labelClassName,
@@ -796,9 +802,12 @@ var FileUpload = /*#__PURE__*/function (_Component) {
       }, this.chooseButtonLabel());
       var label = this.props.auto ? chooseLabel : /*#__PURE__*/React.createElement("span", {
         className: labelClassName
-      }, this.hasFiles() ? this.state.files[0].name : chooseLabel);
-      var icon = /*#__PURE__*/React.createElement("span", {
-        className: iconClassName
+      }, hasFiles ? this.state.files[0].name : chooseLabel);
+      var icon = IconUtils.getJSXIcon(chooseIcon, {
+        className: 'p-button-icon p-button-icon-left'
+      }, {
+        props: this.props,
+        hasFiles: hasFiles
       });
       return /*#__PURE__*/React.createElement("div", {
         className: className,
@@ -815,7 +824,7 @@ var FileUpload = /*#__PURE__*/function (_Component) {
         onFocus: this.onFocus,
         onBlur: this.onBlur,
         tabIndex: 0
-      }, icon, label, !this.hasFiles() && /*#__PURE__*/React.createElement("input", {
+      }, icon, label, !hasFiles && /*#__PURE__*/React.createElement("input", {
         ref: function ref(el) {
           return _this8.fileInput = el;
         },