@progress/kendo-react-upload 14.1.1 → 14.1.2-develop.2

package/Upload.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const E=require("react"),t=require("prop-types"),m=require("@progress/kendo-react-common"),r=require("./interfaces/UploadFileStatus.js"),O=require("./UploadNavigation.js"),U=require("axios"),R=require("./utils/utils.js"),d=require("./utils/stateUtils.js"),f=require("./utils/connectionUtils.js"),D=require("./utils/validationUtils.js"),b=require("./package-metadata.js");function P(g){const u=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(g){for(const s in g)if(s!=="default"){const e=Object.getOwnPropertyDescriptor(g,s);Object.defineProperty(u,s,e.get?e:{enumerable:!0,get:()=>g[s]})}}return u.default=g,Object.freeze(u)}const S=P(E),F=class F extends S.Component{constructor(u){super(u),this._httpSubscriptions={},this._uploadNavigation=null,this.showLicenseWatermark=!1,this.focus=()=>{this._uploadNavigation&&this._uploadNavigation.focus()},this.triggerUpload=()=>{this.onUpload()},this.uploadFiles=s=>{const e=this.async;d.setFilesStatus(s,r.UploadFileStatus.Uploading),d.groupForEach(s,(o,a)=>{const n=f.cloneRequestHeaders(e.saveHeaders||{}),l={target:this,files:o,headers:n,additionalData:{}};this.props.onBeforeUpload&&this.props.onBeforeUpload.call(void 0,l);const h=f.populateRequestOptions(l.headers,this.async),v=f.populateUploadFormData(o,e.saveField,l.additionalData);if(this.isCustomSave)this.props.saveUrl(o,{formData:v,requestOptions:h},this.onUploadProgress).then(c=>this.onUploadSuccess(c.uid)).catch(c=>this.onUploadError(c.uid));else{const c=U.CancelToken.source();this._httpSubscriptions[a]=c,U({method:e.saveMethod,url:e.saveUrl,data:v,cancelToken:c.token,...h,onUploadProgress:p=>this.onUploadProgress(a,p)}).then(p=>this.onUploadSuccess(a,p)).catch(p=>this.onUploadError(a,p))}})},this.removeFiles=s=>{const e=this.async;d.groupForEach(s,(o,a)=>{const n=f.cloneRequestHeaders(e.removeHeaders||{}),l={target:this,files:o,headers:n,additionalData:{}};this.props.onBeforeRemove&&this.props.onBeforeRemove.call(void 0,l);const h=o.map(p=>p.name),v=f.populateRequestOptions(l.headers,this.async),c=f.populateRemoveFormData(h,e.removeField,l.additionalData);this.isCustomRemove?this.props.removeUrl(o,{formData:c,requestOptions:v}).then(p=>this.onRemoveSuccess(p.uid)).catch(p=>this.onRemoveError(p.uid)):U({method:e.removeMethod,url:e.removeUrl,data:c,...v}).then(p=>this.onRemoveSuccess(a,p)).catch(p=>this.onRemoveError(a,p))})},this.onUpload=()=>{const s=this.fileStateCopy,e=d.groupFilesByUid(s),o=d.filesForUpload(e);this.uploadFiles(o);const a=()=>{if(this.props.onStatusChange){const n={target:this,newState:s,affectedFiles:d.flatFileGroup(o)};this.props.onStatusChange.call(void 0,n)}};this.isControlled?a():this.setState({files:s},a)},this.onAdd=s=>{let e=R.getAllFileInfo(s),o;if(e=R.assignGuidToFiles(e,this.async.batch),D.validateFiles(e,this.props.restrictions),this.props.multiple?o=this.fileStateCopy:o=[],d.addMany(e,o),this.async.autoUpload){const n=d.groupFilesByUid(o);this.uploadFiles(d.filesForUpload(n))}const a=()=>{if(this.props.onAdd){const n={target:this,newState:o,affectedFiles:e};this.props.onAdd.call(void 0,n)}};this.isControlled?a():this.setState({files:o},a)},this.onUploadProgress=(s,e)=>{const o=Math.round(100*e.loaded/(e.total||0))||0,a=()=>{if(this.props.onProgress){const n=this.fileStateCopy,i=n.filter(h=>h.uid===s);this.setFilesProgress(n,o);const l={target:this,newState:n,affectedFiles:i};this.props.onProgress.call(void 0,l)}};this.isControlled?a():this.setState(n=>{const i=n.files,l=i.filter(h=>h.uid===s);if(this.setFilesProgress(l,o),!!l.length)return{files:i}},a)},this.onUploadSuccess=(s,e)=>{const o=this.fileStateCopy,a=o.filter(i=>i.uid===s);a.forEach(i=>{i.status=r.UploadFileStatus.Uploaded,i.progress=100}),delete this._httpSubscriptions[s];const n=()=>{if(this.props.onStatusChange){const i={target:this,newState:o,affectedFiles:a,response:e?f.convertAxiosResponse(e):void 0};this.props.onStatusChange.call(void 0,i)}};this.isControlled?n():this.setState({files:o},n)},this.onUploadError=(s,e)=>{const o=this.fileStateCopy,a=o.filter(i=>i.uid===s);if(a.forEach(i=>{i.status=r.UploadFileStatus.UploadFailed}),delete this._httpSubscriptions[s],!a.length)return;const n=()=>{if(this.props.onStatusChange){const i={target:this,newState:o,affectedFiles:a,response:e?f.convertAxiosResponse(e):void 0};this.props.onStatusChange.call(void 0,i)}};this.isControlled?n():this.setState({files:o},n)},this.onRemove=s=>{const e=this.fileStateCopy,o=e.filter(i=>i.uid===s),a=e.filter(i=>i.uid!==s);if([r.UploadFileStatus.Uploaded,r.UploadFileStatus.Initial,r.UploadFileStatus.RemoveFailed].indexOf(o[0].status)>-1){const i={[s]:o};d.setFilesStatus(i,r.UploadFileStatus.Removing),this.removeFiles(i);const l=()=>{if(this.props.onStatusChange){const h={target:this,newState:e,affectedFiles:o};this.props.onStatusChange.call(void 0,h)}};this.isControlled?l():this.setState({files:e},l)}else{const i=()=>{if(this.props.onRemove){const l={target:this,newState:a,affectedFiles:o};this.props.onRemove.call(void 0,l)}};this.isControlled?i():this.setState({files:a},i)}},this.onRemoveSuccess=(s,e)=>{const o=this.fileStateCopy,a=o.filter(l=>l.uid===s),n=o.filter(l=>l.uid!==s),i=()=>{if(this.props.onRemove){const l={target:this,newState:n,affectedFiles:a,response:e?f.convertAxiosResponse(e):void 0};this.props.onRemove.call(void 0,l)}};this.isControlled?i():this.setState({files:n},i)},this.onRemoveError=(s,e)=>{const o=this.fileStateCopy,a=o.filter(i=>i.uid===s);a.forEach(i=>{i.status=r.UploadFileStatus.RemoveFailed});const n=()=>{if(this.props.onStatusChange){const i={target:this,newState:o,affectedFiles:a,response:e?f.convertAxiosResponse(e):void 0};this.props.onStatusChange.call(void 0,i)}};this.isControlled?n():this.setState({files:o},n)},this.onRetry=s=>{const e=this.fileStateCopy,o=d.groupFilesByUid(e.filter(n=>n.uid===s));d.setFilesStatus(o,r.UploadFileStatus.Uploading),this.uploadFiles(o);const a=()=>{if(this.props.onStatusChange){const n={target:this,newState:e,affectedFiles:d.flatFileGroup(o)};this.props.onStatusChange.call(void 0,n)}};this.isControlled?a():this.setState({files:e},a)},this.onCancel=s=>{const e=this.fileStateCopy,o=e.filter(i=>i.uid!==s),a=e.filter(i=>i.uid===s);if(this._httpSubscriptions[s]&&(this._httpSubscriptions[s].cancel(),delete this._httpSubscriptions[s]),this.props.onCancel){const i={target:this,uid:s};this.props.onCancel.call(void 0,i)}const n=()=>{if(this.props.onRemove){const i={target:this,newState:o,affectedFiles:a};this.props.onRemove.call(void 0,i)}};this.isControlled?n():this.setState({files:o},n)},this.onClear=()=>{if(!this.files.length)return;Object.keys(this._httpSubscriptions).forEach(e=>{this._httpSubscriptions[e].cancel()}),this._httpSubscriptions={};const s=()=>{if(this.props.onRemove){const e={target:this,newState:[],affectedFiles:this.fileStateCopy};this.props.onRemove.call(void 0,e)}};this.isControlled?s():this.setState({files:[]},s)},this.showLicenseWatermark=!m.validatePackage(b.packageMetadata,{component:"Upload"}),this.licenseMessage=m.getLicenseMessage(b.packageMetadata),this.state={files:u.defaultFiles||[]}}get async(){const{autoUpload:u,batch:s,removeField:e,removeHeaders:o,removeMethod:a,removeUrl:n,responseType:i,saveField:l,saveHeaders:h,saveMethod:v,saveUrl:c,withCredentials:p}=this.props;return{autoUpload:u,batch:s,removeField:e,removeHeaders:o,removeMethod:a,removeUrl:n,responseType:i,saveField:l,saveHeaders:h,saveMethod:v,saveUrl:c,withCredentials:p}}get files(){return(this.isControlled?this.props.files:this.state.files)||[]}get isControlled(){return!this.props.defaultFiles}get isCustomSave(){return this.props.saveUrl&&typeof this.props.saveUrl=="function"}get isCustomRemove(){return this.props.removeUrl&&typeof this.props.removeUrl=="function"}get fileStateCopy(){return this.isControlled?d.copyState(this.props.files):d.copyState(this.state.files)}get actionElement(){if(this._uploadNavigation)return this._uploadNavigation.actionElement}setFilesProgress(u,s){u.forEach(e=>{e.progress=s,e.status===r.UploadFileStatus.Uploading&&s===100&&(e.status=r.UploadFileStatus.Uploaded)})}render(){var y;const{showFileList:u,onAdd:s,onRemove:e,onCancel:o,autoUpload:a,showActionButtons:n,actionsLayout:i,tabIndex:l,disabled:h,...v}=this.props,c=d.groupFilesByUid(this.files),p=d.filesForUpload(c);return S.createElement(S.Fragment,null,S.createElement(O.UploadNavigation,{groupedFiles:c,className:this.props.className,showFileList:u&&!!Object.keys(c).length,showActionButtons:n&&!a&&(!!Object.keys(p).length||!!((y=this.props.defaultFiles)!=null&&y.length)),actionsLayout:i,autoUpload:a,disabled:h,onAdd:this.onAdd,onRemove:this.onRemove,onClear:this.onClear,onUpload:this.onUpload,onRetry:this.onRetry,onCancel:this.onCancel,tabIndex:m.getTabIndex(l,h),ref:w=>{this._uploadNavigation=w},...v}),this.showLicenseWatermark&&S.createElement(m.WatermarkOverlay,{message:this.licenseMessage}))}};F.defaultProps={autoUpload:!0,batch:!1,removeField:"fileNames",removeHeaders:{},removeMethod:"POST",removeUrl:"",responseType:"json",saveField:"files",saveHeaders:{},saveMethod:"POST",saveUrl:"",withCredentials:!0,restrictions:{allowedExtensions:[],maxFileSize:0,minFileSize:0},multiple:!0,showFileList:!0,showActionButtons:!0,actionsLayout:"end",disabled:!1},F.propTypes={autoUpload:t.bool,batch:t.bool,withCredentials:t.bool,saveField:t.string,saveHeaders:t.object,saveMethod:t.string,saveUrl:t.oneOfType([t.string,t.func]),responseType:t.oneOf(["arraybuffer","blob","json","text"]),removeField:t.string,removeHeaders:t.object,removeMethod:t.string,removeUrl:t.oneOfType([t.string,t.func]),multiple:t.bool,disabled:t.bool,showFileList:t.bool,showActionButtons:t.bool,actionsLayout:t.oneOf(["start","center","end","stretched"]),tabIndex:t.number,accept:t.string,listItemUI:t.oneOfType([t.func,t.string,t.shape({render:t.func.isRequired})]),restrictions:t.shape({allowedExtensions:t.arrayOf(t.string),maxFileSize:t.number,minFileSize:t.number}),files:t.arrayOf(t.shape({uid:t.string,name:t.string,extension:t.string,size:t.number,validationErrors:t.arrayOf(t.string),status:t.oneOf([r.UploadFileStatus.Initial,r.UploadFileStatus.RemoveFailed,r.UploadFileStatus.Removing,r.UploadFileStatus.Selected,r.UploadFileStatus.UploadFailed,r.UploadFileStatus.Uploaded,r.UploadFileStatus.Uploading]),progress:t.number,getRawFile:t.func})),defaultFiles:t.arrayOf(t.shape({uid:t.string,name:t.string,extension:t.string,size:t.number,validationErrors:t.arrayOf(t.string),status:t.oneOf([r.UploadFileStatus.Initial,r.UploadFileStatus.RemoveFailed,r.UploadFileStatus.Removing,r.UploadFileStatus.Selected,r.UploadFileStatus.UploadFailed,r.UploadFileStatus.Uploaded,r.UploadFileStatus.Uploading]),progress:t.number,getRawFile:t.func}))};let C=F;exports.Upload=C;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const E=require("react"),t=require("prop-types"),m=require("@progress/kendo-react-common"),r=require("./interfaces/UploadFileStatus.js"),O=require("./UploadNavigation.js"),U=require("axios"),R=require("./utils/utils.js"),c=require("./utils/stateUtils.js"),f=require("./utils/connectionUtils.js"),D=require("./utils/validationUtils.js"),b=require("./package-metadata.js");function P(g){const u=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(g){for(const s in g)if(s!=="default"){const e=Object.getOwnPropertyDescriptor(g,s);Object.defineProperty(u,s,e.get?e:{enumerable:!0,get:()=>g[s]})}}return u.default=g,Object.freeze(u)}const S=P(E),F=class F extends S.Component{constructor(u){super(u),this._httpSubscriptions={},this._uploadNavigation=null,this.showLicenseWatermark=!1,this.focus=()=>{this._uploadNavigation&&this._uploadNavigation.focus()},this.triggerUpload=()=>{this.onUpload()},this.uploadFiles=s=>{const e=this.async;c.setFilesStatus(s,r.UploadFileStatus.Uploading),c.groupForEach(s,(o,a)=>{const n=f.cloneRequestHeaders(e.saveHeaders||{}),l={target:this,files:o,headers:n,additionalData:{}};this.props.onBeforeUpload&&this.props.onBeforeUpload.call(void 0,l);const h=f.populateRequestOptions(l.headers,this.async),v=f.populateUploadFormData(o,e.saveField,l.additionalData);if(this.isCustomSave)this.props.saveUrl(o,{formData:v,requestOptions:h},this.onUploadProgress).then(d=>this.onUploadSuccess(d.uid)).catch(d=>this.onUploadError(d.uid));else{const d=U.CancelToken.source();this._httpSubscriptions[a]=d,U({method:e.saveMethod,url:e.saveUrl,data:v,cancelToken:d.token,...h,onUploadProgress:p=>this.onUploadProgress(a,p)}).then(p=>this.onUploadSuccess(a,p)).catch(p=>this.onUploadError(a,p))}})},this.removeFiles=s=>{const e=this.async;c.groupForEach(s,(o,a)=>{const n=f.cloneRequestHeaders(e.removeHeaders||{}),l={target:this,files:o,headers:n,additionalData:{}};this.props.onBeforeRemove&&this.props.onBeforeRemove.call(void 0,l);const h=o.map(p=>p.name),v=f.populateRequestOptions(l.headers,this.async),d=f.populateRemoveFormData(h,e.removeField,l.additionalData);this.isCustomRemove?this.props.removeUrl(o,{formData:d,requestOptions:v}).then(p=>this.onRemoveSuccess(p.uid)).catch(p=>this.onRemoveError(p.uid)):U({method:e.removeMethod,url:e.removeUrl,data:d,...v}).then(p=>this.onRemoveSuccess(a,p)).catch(p=>this.onRemoveError(a,p))})},this.onUpload=()=>{const s=this.fileStateCopy,e=c.groupFilesByUid(s),o=c.filesForUpload(e);this.uploadFiles(o);const a=()=>{if(this.props.onStatusChange){const n={target:this,newState:s,affectedFiles:c.flatFileGroup(o)};this.props.onStatusChange.call(void 0,n)}};this.isControlled?a():this.setState({files:s},a)},this.onAdd=s=>{let e=R.getAllFileInfo(s),o;if(e=R.assignGuidToFiles(e,this.async.batch),D.validateFiles(e,this.props.restrictions),this.props.multiple?o=this.fileStateCopy:o=[],c.addMany(e,o),this.async.autoUpload){const n=c.groupFilesByUid(o);this.uploadFiles(c.filesForUpload(n))}const a=()=>{if(this.props.onAdd){const n={target:this,newState:o,affectedFiles:e};this.props.onAdd.call(void 0,n)}};this.isControlled?a():this.setState({files:o},a)},this.onUploadProgress=(s,e)=>{const o=Math.round(100*e.loaded/(e.total||0))||0,a=()=>{if(this.props.onProgress){const n=this.fileStateCopy,i=n.filter(h=>h.uid===s);this.setFilesProgress(n,o);const l={target:this,newState:n,affectedFiles:i};this.props.onProgress.call(void 0,l)}};this.isControlled?a():this.setState(n=>{const i=n.files,l=i.filter(h=>h.uid===s);if(this.setFilesProgress(l,o),!!l.length)return{files:i}},a)},this.onUploadSuccess=(s,e)=>{const o=this.fileStateCopy,a=o.filter(i=>i.uid===s);a.forEach(i=>{i.status=r.UploadFileStatus.Uploaded,i.progress=100}),delete this._httpSubscriptions[s];const n=()=>{if(this.props.onStatusChange){const i={target:this,newState:o,affectedFiles:a,response:e?f.convertAxiosResponse(e):void 0};this.props.onStatusChange.call(void 0,i)}};this.isControlled?n():this.setState({files:o},n)},this.onUploadError=(s,e)=>{const o=this.fileStateCopy,a=o.filter(i=>i.uid===s);if(a.forEach(i=>{i.status=r.UploadFileStatus.UploadFailed}),delete this._httpSubscriptions[s],!a.length)return;const n=()=>{if(this.props.onStatusChange){const i={target:this,newState:o,affectedFiles:a,response:e?f.convertAxiosResponse(e):void 0};this.props.onStatusChange.call(void 0,i)}};this.isControlled?n():this.setState({files:o},n)},this.onRemove=s=>{const e=this.fileStateCopy,o=e.filter(i=>i.uid===s),a=e.filter(i=>i.uid!==s);if([r.UploadFileStatus.Uploaded,r.UploadFileStatus.Initial,r.UploadFileStatus.RemoveFailed].indexOf(o[0].status)>-1){const i={[s]:o};c.setFilesStatus(i,r.UploadFileStatus.Removing),this.removeFiles(i);const l=()=>{if(this.props.onStatusChange){const h={target:this,newState:e,affectedFiles:o};this.props.onStatusChange.call(void 0,h)}};this.isControlled?l():this.setState({files:e},l)}else{const i=()=>{if(this.props.onRemove){const l={target:this,newState:a,affectedFiles:o};this.props.onRemove.call(void 0,l)}};this.isControlled?i():this.setState({files:a},i)}},this.onRemoveSuccess=(s,e)=>{const o=this.fileStateCopy,a=o.filter(l=>l.uid===s),n=o.filter(l=>l.uid!==s),i=()=>{if(this.props.onRemove){const l={target:this,newState:n,affectedFiles:a,response:e?f.convertAxiosResponse(e):void 0};this.props.onRemove.call(void 0,l)}};this.isControlled?i():this.setState({files:n},i)},this.onRemoveError=(s,e)=>{const o=this.fileStateCopy,a=o.filter(i=>i.uid===s);a.forEach(i=>{i.status=r.UploadFileStatus.RemoveFailed});const n=()=>{if(this.props.onStatusChange){const i={target:this,newState:o,affectedFiles:a,response:e?f.convertAxiosResponse(e):void 0};this.props.onStatusChange.call(void 0,i)}};this.isControlled?n():this.setState({files:o},n)},this.onRetry=s=>{const e=this.fileStateCopy,o=c.groupFilesByUid(e.filter(n=>n.uid===s));c.setFilesStatus(o,r.UploadFileStatus.Uploading),this.uploadFiles(o);const a=()=>{if(this.props.onStatusChange){const n={target:this,newState:e,affectedFiles:c.flatFileGroup(o)};this.props.onStatusChange.call(void 0,n)}};this.isControlled?a():this.setState({files:e},a)},this.onCancel=s=>{const e=this.fileStateCopy,o=e.filter(i=>i.uid!==s),a=e.filter(i=>i.uid===s);if(this._httpSubscriptions[s]&&(this._httpSubscriptions[s].cancel(),delete this._httpSubscriptions[s]),this.props.onCancel){const i={target:this,uid:s};this.props.onCancel.call(void 0,i)}const n=()=>{if(this.props.onRemove){const i={target:this,newState:o,affectedFiles:a};this.props.onRemove.call(void 0,i)}};this.isControlled?n():this.setState({files:o},n)},this.onClear=()=>{if(!this.files.length)return;Object.keys(this._httpSubscriptions).forEach(e=>{this._httpSubscriptions[e].cancel()}),this._httpSubscriptions={};const s=()=>{if(this.props.onRemove){const e={target:this,newState:[],affectedFiles:this.fileStateCopy};this.props.onRemove.call(void 0,e)}};this.isControlled?s():this.setState({files:[]},s)},this.showLicenseWatermark=!m.validatePackage(b.packageMetadata,{component:"Upload"}),this.licenseMessage=m.getLicenseMessage(b.packageMetadata),this.state={files:u.defaultFiles||[]}}get async(){const{autoUpload:u,batch:s,removeField:e,removeHeaders:o,removeMethod:a,removeUrl:n,responseType:i,saveField:l,saveHeaders:h,saveMethod:v,saveUrl:d,withCredentials:p}=this.props;return{autoUpload:u,batch:s,removeField:e,removeHeaders:o,removeMethod:a,removeUrl:n,responseType:i,saveField:l,saveHeaders:h,saveMethod:v,saveUrl:d,withCredentials:p}}get files(){return(this.isControlled?this.props.files:this.state.files)||[]}get isControlled(){return!this.props.defaultFiles}get isCustomSave(){return this.props.saveUrl&&typeof this.props.saveUrl=="function"}get isCustomRemove(){return this.props.removeUrl&&typeof this.props.removeUrl=="function"}get fileStateCopy(){return this.isControlled?c.copyState(this.props.files):c.copyState(this.state.files)}get actionElement(){if(this._uploadNavigation)return this._uploadNavigation.actionElement}setFilesProgress(u,s){u.forEach(e=>{e.progress=s})}render(){var y;const{showFileList:u,onAdd:s,onRemove:e,onCancel:o,autoUpload:a,showActionButtons:n,actionsLayout:i,tabIndex:l,disabled:h,...v}=this.props,d=c.groupFilesByUid(this.files),p=c.filesForUpload(d);return S.createElement(S.Fragment,null,S.createElement(O.UploadNavigation,{groupedFiles:d,className:this.props.className,showFileList:u&&!!Object.keys(d).length,showActionButtons:n&&!a&&(!!Object.keys(p).length||!!((y=this.props.defaultFiles)!=null&&y.length)),actionsLayout:i,autoUpload:a,disabled:h,onAdd:this.onAdd,onRemove:this.onRemove,onClear:this.onClear,onUpload:this.onUpload,onRetry:this.onRetry,onCancel:this.onCancel,tabIndex:m.getTabIndex(l,h),ref:w=>{this._uploadNavigation=w},...v}),this.showLicenseWatermark&&S.createElement(m.WatermarkOverlay,{message:this.licenseMessage}))}};F.defaultProps={autoUpload:!0,batch:!1,removeField:"fileNames",removeHeaders:{},removeMethod:"POST",removeUrl:"",responseType:"json",saveField:"files",saveHeaders:{},saveMethod:"POST",saveUrl:"",withCredentials:!0,restrictions:{allowedExtensions:[],maxFileSize:0,minFileSize:0},multiple:!0,showFileList:!0,showActionButtons:!0,actionsLayout:"end",disabled:!1},F.propTypes={autoUpload:t.bool,batch:t.bool,withCredentials:t.bool,saveField:t.string,saveHeaders:t.object,saveMethod:t.string,saveUrl:t.oneOfType([t.string,t.func]),responseType:t.oneOf(["arraybuffer","blob","json","text"]),removeField:t.string,removeHeaders:t.object,removeMethod:t.string,removeUrl:t.oneOfType([t.string,t.func]),multiple:t.bool,disabled:t.bool,showFileList:t.bool,showActionButtons:t.bool,actionsLayout:t.oneOf(["start","center","end","stretched"]),tabIndex:t.number,accept:t.string,listItemUI:t.oneOfType([t.func,t.string,t.shape({render:t.func.isRequired})]),restrictions:t.shape({allowedExtensions:t.arrayOf(t.string),maxFileSize:t.number,minFileSize:t.number}),files:t.arrayOf(t.shape({uid:t.string,name:t.string,extension:t.string,size:t.number,validationErrors:t.arrayOf(t.string),status:t.oneOf([r.UploadFileStatus.Initial,r.UploadFileStatus.RemoveFailed,r.UploadFileStatus.Removing,r.UploadFileStatus.Selected,r.UploadFileStatus.UploadFailed,r.UploadFileStatus.Uploaded,r.UploadFileStatus.Uploading]),progress:t.number,getRawFile:t.func})),defaultFiles:t.arrayOf(t.shape({uid:t.string,name:t.string,extension:t.string,size:t.number,validationErrors:t.arrayOf(t.string),status:t.oneOf([r.UploadFileStatus.Initial,r.UploadFileStatus.RemoveFailed,r.UploadFileStatus.Removing,r.UploadFileStatus.Selected,r.UploadFileStatus.UploadFailed,r.UploadFileStatus.Uploaded,r.UploadFileStatus.Uploading]),progress:t.number,getRawFile:t.func}))};let C=F;exports.Upload=C;

package/Upload.mjs

@@ -6,7 +6,7 @@
  *-------------------------------------------------------------------------------------------
  */
 import * as m from "react";
-import t from "prop-types";
+import e from "prop-types";
 import { validatePackage as b, getLicenseMessage as E, getTabIndex as w, WatermarkOverlay as D } from "@progress/kendo-react-common";
 import { UploadFileStatus as l } from "./interfaces/UploadFileStatus.mjs";
 import { UploadNavigation as O } from "./UploadNavigation.mjs";
@@ -23,9 +23,9 @@ const g = class g extends m.Component {
     }, this.triggerUpload = () => {
       this.onUpload();
     }, this.uploadFiles = (i) => {
-      const e = this.async;
+      const t = this.async;
       p.setFilesStatus(i, l.Uploading), p.groupForEach(i, (s, a) => {
-        const n = f.cloneRequestHeaders(e.saveHeaders || {}), r = {
+        const n = f.cloneRequestHeaders(t.saveHeaders || {}), r = {
           target: this,
           files: s,
           headers: n,
@@ -34,7 +34,7 @@ const g = class g extends m.Component {
         this.props.onBeforeUpload && this.props.onBeforeUpload.call(void 0, r);
         const c = f.populateRequestOptions(r.headers, this.async), v = f.populateUploadFormData(
           s,
-          e.saveField,
+          t.saveField,
           r.additionalData
         );
         if (this.isCustomSave)
@@ -46,8 +46,8 @@ const g = class g extends m.Component {
         else {
           const d = S.CancelToken.source();
           this._httpSubscriptions[a] = d, S({
-            method: e.saveMethod,
-            url: e.saveUrl,
+            method: t.saveMethod,
+            url: t.saveUrl,
             data: v,
             cancelToken: d.token,
             ...c,
@@ -56,9 +56,9 @@ const g = class g extends m.Component {
         }
       });
     }, this.removeFiles = (i) => {
-      const e = this.async;
+      const t = this.async;
       p.groupForEach(i, (s, a) => {
-        const n = f.cloneRequestHeaders(e.removeHeaders || {}), r = {
+        const n = f.cloneRequestHeaders(t.removeHeaders || {}), r = {
           target: this,
           files: s,
           headers: n,
@@ -67,18 +67,18 @@ const g = class g extends m.Component {
         this.props.onBeforeRemove && this.props.onBeforeRemove.call(void 0, r);
         const c = s.map((h) => h.name), v = f.populateRequestOptions(r.headers, this.async), d = f.populateRemoveFormData(
           c,
-          e.removeField,
+          t.removeField,
           r.additionalData
         );
         this.isCustomRemove ? this.props.removeUrl(s, { formData: d, requestOptions: v }).then((h) => this.onRemoveSuccess(h.uid)).catch((h) => this.onRemoveError(h.uid)) : S({
-          method: e.removeMethod,
-          url: e.removeUrl,
+          method: t.removeMethod,
+          url: t.removeUrl,
           data: d,
           ...v
         }).then((h) => this.onRemoveSuccess(a, h)).catch((h) => this.onRemoveError(a, h));
       });
     }, this.onUpload = () => {
-      const i = this.fileStateCopy, e = p.groupFilesByUid(i), s = p.filesForUpload(e);
+      const i = this.fileStateCopy, t = p.groupFilesByUid(i), s = p.filesForUpload(t);
       this.uploadFiles(s);
       const a = () => {
         if (this.props.onStatusChange) {
@@ -92,8 +92,8 @@ const g = class g extends m.Component {
       };
       this.isControlled ? a() : this.setState({ files: i }, a);
     }, this.onAdd = (i) => {
-      let e = C.getAllFileInfo(i), s;
-      if (e = C.assignGuidToFiles(e, this.async.batch), x.validateFiles(e, this.props.restrictions), this.props.multiple ? s = this.fileStateCopy : s = [], p.addMany(e, s), this.async.autoUpload) {
+      let t = C.getAllFileInfo(i), s;
+      if (t = C.assignGuidToFiles(t, this.async.batch), x.validateFiles(t, this.props.restrictions), this.props.multiple ? s = this.fileStateCopy : s = [], p.addMany(t, s), this.async.autoUpload) {
         const n = p.groupFilesByUid(s);
         this.uploadFiles(p.filesForUpload(n));
       }
@@ -102,14 +102,14 @@ const g = class g extends m.Component {
           const n = {
             target: this,
             newState: s,
-            affectedFiles: e
+            affectedFiles: t
           };
           this.props.onAdd.call(void 0, n);
         }
       };
       this.isControlled ? a() : this.setState({ files: s }, a);
-    }, this.onUploadProgress = (i, e) => {
-      const s = Math.round(100 * e.loaded / (e.total || 0)) || 0, a = () => {
+    }, this.onUploadProgress = (i, t) => {
+      const s = Math.round(100 * t.loaded / (t.total || 0)) || 0, a = () => {
         if (this.props.onProgress) {
           const n = this.fileStateCopy, o = n.filter((c) => c.uid === i);
           this.setFilesProgress(n, s);
@@ -122,7 +122,7 @@ const g = class g extends m.Component {
         if (this.setFilesProgress(r, s), !!r.length)
           return { files: o };
       }, a);
-    }, this.onUploadSuccess = (i, e) => {
+    }, this.onUploadSuccess = (i, t) => {
       const s = this.fileStateCopy, a = s.filter((o) => o.uid === i);
       a.forEach((o) => {
         o.status = l.Uploaded, o.progress = 100;
@@ -133,13 +133,13 @@ const g = class g extends m.Component {
             target: this,
             newState: s,
             affectedFiles: a,
-            response: e ? f.convertAxiosResponse(e) : void 0
+            response: t ? f.convertAxiosResponse(t) : void 0
           };
           this.props.onStatusChange.call(void 0, o);
         }
       };
       this.isControlled ? n() : this.setState({ files: s }, n);
-    }, this.onUploadError = (i, e) => {
+    }, this.onUploadError = (i, t) => {
       const s = this.fileStateCopy, a = s.filter((o) => o.uid === i);
       if (a.forEach((o) => {
         o.status = l.UploadFailed;
@@ -151,14 +151,14 @@ const g = class g extends m.Component {
             target: this,
             newState: s,
             affectedFiles: a,
-            response: e ? f.convertAxiosResponse(e) : void 0
+            response: t ? f.convertAxiosResponse(t) : void 0
           };
           this.props.onStatusChange.call(void 0, o);
         }
       };
       this.isControlled ? n() : this.setState({ files: s }, n);
     }, this.onRemove = (i) => {
-      const e = this.fileStateCopy, s = e.filter((o) => o.uid === i), a = e.filter((o) => o.uid !== i);
+      const t = this.fileStateCopy, s = t.filter((o) => o.uid === i), a = t.filter((o) => o.uid !== i);
       if ([
         l.Uploaded,
         l.Initial,
@@ -172,13 +172,13 @@ const g = class g extends m.Component {
           if (this.props.onStatusChange) {
             const c = {
               target: this,
-              newState: e,
+              newState: t,
               affectedFiles: s
             };
             this.props.onStatusChange.call(void 0, c);
           }
         };
-        this.isControlled ? r() : this.setState({ files: e }, r);
+        this.isControlled ? r() : this.setState({ files: t }, r);
       } else {
         const o = () => {
           if (this.props.onRemove) {
@@ -192,20 +192,20 @@ const g = class g extends m.Component {
         };
         this.isControlled ? o() : this.setState({ files: a }, o);
       }
-    }, this.onRemoveSuccess = (i, e) => {
+    }, this.onRemoveSuccess = (i, t) => {
       const s = this.fileStateCopy, a = s.filter((r) => r.uid === i), n = s.filter((r) => r.uid !== i), o = () => {
         if (this.props.onRemove) {
           const r = {
             target: this,
             newState: n,
             affectedFiles: a,
-            response: e ? f.convertAxiosResponse(e) : void 0
+            response: t ? f.convertAxiosResponse(t) : void 0
           };
           this.props.onRemove.call(void 0, r);
         }
       };
       this.isControlled ? o() : this.setState({ files: n }, o);
-    }, this.onRemoveError = (i, e) => {
+    }, this.onRemoveError = (i, t) => {
       const s = this.fileStateCopy, a = s.filter((o) => o.uid === i);
       a.forEach((o) => {
         o.status = l.RemoveFailed;
@@ -216,28 +216,28 @@ const g = class g extends m.Component {
             target: this,
             newState: s,
             affectedFiles: a,
-            response: e ? f.convertAxiosResponse(e) : void 0
+            response: t ? f.convertAxiosResponse(t) : void 0
           };
           this.props.onStatusChange.call(void 0, o);
         }
       };
       this.isControlled ? n() : this.setState({ files: s }, n);
     }, this.onRetry = (i) => {
-      const e = this.fileStateCopy, s = p.groupFilesByUid(e.filter((n) => n.uid === i));
+      const t = this.fileStateCopy, s = p.groupFilesByUid(t.filter((n) => n.uid === i));
       p.setFilesStatus(s, l.Uploading), this.uploadFiles(s);
       const a = () => {
         if (this.props.onStatusChange) {
           const n = {
             target: this,
-            newState: e,
+            newState: t,
             affectedFiles: p.flatFileGroup(s)
           };
           this.props.onStatusChange.call(void 0, n);
         }
       };
-      this.isControlled ? a() : this.setState({ files: e }, a);
+      this.isControlled ? a() : this.setState({ files: t }, a);
     }, this.onCancel = (i) => {
-      const e = this.fileStateCopy, s = e.filter((o) => o.uid !== i), a = e.filter((o) => o.uid === i);
+      const t = this.fileStateCopy, s = t.filter((o) => o.uid !== i), a = t.filter((o) => o.uid === i);
       if (this._httpSubscriptions[i] && (this._httpSubscriptions[i].cancel(), delete this._httpSubscriptions[i]), this.props.onCancel) {
         const o = {
           target: this,
@@ -259,17 +259,17 @@ const g = class g extends m.Component {
     }, this.onClear = () => {
       if (!this.files.length)
         return;
-      Object.keys(this._httpSubscriptions).forEach((e) => {
-        this._httpSubscriptions[e].cancel();
+      Object.keys(this._httpSubscriptions).forEach((t) => {
+        this._httpSubscriptions[t].cancel();
       }), this._httpSubscriptions = {};
       const i = () => {
         if (this.props.onRemove) {
-          const e = {
+          const t = {
             target: this,
             newState: [],
             affectedFiles: this.fileStateCopy
           };
-          this.props.onRemove.call(void 0, e);
+          this.props.onRemove.call(void 0, t);
         }
       };
       this.isControlled ? i() : this.setState({ files: [] }, i);
@@ -281,7 +281,7 @@ const g = class g extends m.Component {
     const {
       autoUpload: u,
       batch: i,
-      removeField: e,
+      removeField: t,
       removeHeaders: s,
       removeMethod: a,
       removeUrl: n,
@@ -295,7 +295,7 @@ const g = class g extends m.Component {
     return {
       autoUpload: u,
       batch: i,
-      removeField: e,
+      removeField: t,
       removeHeaders: s,
       removeMethod: a,
       removeUrl: n,
@@ -333,8 +333,8 @@ const g = class g extends m.Component {
    * @hidden
    */
   setFilesProgress(u, i) {
-    u.forEach((e) => {
-      e.progress = i, e.status === l.Uploading && i === 100 && (e.status = l.Uploaded);
+    u.forEach((t) => {
+      t.progress = i;
     });
   }
   /**
@@ -345,7 +345,7 @@ const g = class g extends m.Component {
     const {
       showFileList: u,
       onAdd: i,
-      onRemove: e,
+      onRemove: t,
       onCancel: s,
       autoUpload: a,
       showActionButtons: n,
@@ -403,43 +403,43 @@ g.defaultProps = {
   actionsLayout: "end",
   disabled: !1
 }, g.propTypes = {
-  autoUpload: t.bool,
-  batch: t.bool,
-  withCredentials: t.bool,
-  saveField: t.string,
-  saveHeaders: t.object,
-  saveMethod: t.string,
-  saveUrl: t.oneOfType([t.string, t.func]),
-  responseType: t.oneOf(["arraybuffer", "blob", "json", "text"]),
-  removeField: t.string,
-  removeHeaders: t.object,
-  removeMethod: t.string,
-  removeUrl: t.oneOfType([t.string, t.func]),
-  multiple: t.bool,
-  disabled: t.bool,
-  showFileList: t.bool,
-  showActionButtons: t.bool,
-  actionsLayout: t.oneOf(["start", "center", "end", "stretched"]),
-  tabIndex: t.number,
-  accept: t.string,
-  listItemUI: t.oneOfType([
-    t.func,
-    t.string,
-    t.shape({ render: t.func.isRequired })
+  autoUpload: e.bool,
+  batch: e.bool,
+  withCredentials: e.bool,
+  saveField: e.string,
+  saveHeaders: e.object,
+  saveMethod: e.string,
+  saveUrl: e.oneOfType([e.string, e.func]),
+  responseType: e.oneOf(["arraybuffer", "blob", "json", "text"]),
+  removeField: e.string,
+  removeHeaders: e.object,
+  removeMethod: e.string,
+  removeUrl: e.oneOfType([e.string, e.func]),
+  multiple: e.bool,
+  disabled: e.bool,
+  showFileList: e.bool,
+  showActionButtons: e.bool,
+  actionsLayout: e.oneOf(["start", "center", "end", "stretched"]),
+  tabIndex: e.number,
+  accept: e.string,
+  listItemUI: e.oneOfType([
+    e.func,
+    e.string,
+    e.shape({ render: e.func.isRequired })
   ]),
-  restrictions: t.shape({
-    allowedExtensions: t.arrayOf(t.string),
-    maxFileSize: t.number,
-    minFileSize: t.number
+  restrictions: e.shape({
+    allowedExtensions: e.arrayOf(e.string),
+    maxFileSize: e.number,
+    minFileSize: e.number
   }),
-  files: t.arrayOf(
-    t.shape({
-      uid: t.string,
-      name: t.string,
-      extension: t.string,
-      size: t.number,
-      validationErrors: t.arrayOf(t.string),
-      status: t.oneOf([
+  files: e.arrayOf(
+    e.shape({
+      uid: e.string,
+      name: e.string,
+      extension: e.string,
+      size: e.number,
+      validationErrors: e.arrayOf(e.string),
+      status: e.oneOf([
         l.Initial,
         l.RemoveFailed,
         l.Removing,
@@ -448,18 +448,18 @@ g.defaultProps = {
         l.Uploaded,
         l.Uploading
       ]),
-      progress: t.number,
-      getRawFile: t.func
+      progress: e.number,
+      getRawFile: e.func
     })
   ),
-  defaultFiles: t.arrayOf(
-    t.shape({
-      uid: t.string,
-      name: t.string,
-      extension: t.string,
-      size: t.number,
-      validationErrors: t.arrayOf(t.string),
-      status: t.oneOf([
+  defaultFiles: e.arrayOf(
+    e.shape({
+      uid: e.string,
+      name: e.string,
+      extension: e.string,
+      size: e.number,
+      validationErrors: e.arrayOf(e.string),
+      status: e.oneOf([
         l.Initial,
         l.RemoveFailed,
         l.Removing,
@@ -468,8 +468,8 @@ g.defaultProps = {
         l.Uploaded,
         l.Uploading
       ]),
-      progress: t.number,
-      getRawFile: t.func
+      progress: e.number,
+      getRawFile: e.func
     })
   )
 };

package/dist/cdn/js/kendo-react-upload.js

@@ -12,4 +12,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("@progress/kendo-react-common"),require("@progress/kendo-react-progressbars"),require("@progress/kendo-react-intl"),require("@progress/kendo-react-buttons"),require("@progress/kendo-svg-icons"),require("prop-types"),require("axios")):"function"==typeof define&&define.amd?define(["exports","react","@progress/kendo-react-common","@progress/kendo-react-progressbars","@progress/kendo-react-intl","@progress/kendo-react-buttons","@progress/kendo-svg-icons","prop-types","axios"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).KendoReactUpload={},e.React,e.KendoReactCommon,e.KendoReactProgressbars,e.KendoReactIntl,e.KendoReactButtons,e.KendoSvgIcons,e.PropTypes,e.axios)}(this,function(e,t,s,o,n,i,a,l,r){"use strict";function d(e){var t=Object.create(null);return e&&Object.keys(e).forEach(function(s){if("default"!==s){var o=Object.getOwnPropertyDescriptor(e,s);Object.defineProperty(t,s,o.get?o:{enumerable:!0,get:function(){return e[s]}})}}),t.default=e,Object.freeze(t)}var c=d(t),p=(e=>(e[e.UploadFailed=0]="UploadFailed",e[e.Initial=1]="Initial",e[e.Selected=2]="Selected",e[e.Uploading=3]="Uploading",e[e.Uploaded=4]="Uploaded",e[e.RemoveFailed=5]="RemoveFailed",e[e.Removing=6]="Removing",e))(p||{});const u="upload.cancel",h="upload.clearSelectedFiles",m="upload.dropFilesHere",g="upload.headerStatusUploaded",v="upload.headerStatusUploading",f="upload.invalidFileExtension",y="upload.invalidFiles",E="upload.invalidMaxFileSize",k="upload.invalidMinFileSize",F="upload.remove",b="upload.retry",C="upload.select",U="upload.selectTitle",I="upload.selectNoFilesTitle",S="upload.uploadSelectedFiles",x="upload.total",D="upload.files",R="upload.statusUploaded",w="upload.statusUploadFailed",_="upload.dropZoneHint",N="upload.defaultDropZoneNote",B="upload.dropZoneNote",A={[u]:"Cancel",[h]:"Clear",[m]:"Drop files here to upload",[g]:"Done",[v]:"Uploading...",[f]:"File type not allowed.",[y]:"Invalid file(s). Please check file upload requirements.",[E]:"File size too large.",[k]:"File size too small.",[F]:"Remove",[b]:"Retry",[C]:"Select files...",[U]:"Press to select more files",[I]:"No files selected",[S]:"Upload",[x]:"Total",[D]:"files",[R]:"File(s) successfully uploaded.",[w]:"File(s) failed to upload.",[_]:"Drag and drop files here to upload.",[N]:"",[B]:"Only {0} files are allowed."},O=/&/g,L=/</g,z=/"/g,T=/'/g,M=/>/g,K=e=>(""+e).replace(O,"&amp;").replace(L,"&lt;").replace(M,"&gt;").replace(z,"&quot;").replace(T,"&#39;"),j=e=>{const t=e.match(/\.([^\.]+)$/);return t?t[0]:""},H=e=>{const t=e.name,s=e.size;return{extension:j(t),name:K(t),getRawFile:()=>e,size:s,status:p.Selected,progress:0,uid:""}},P=e=>!!(e.validationErrors&&e.validationErrors.length>0),$={fileHasValidationErrors:P,filesHaveValidationErrors:e=>{for(const t of e)if(P(t))return!0;return!1},getTotalFilesSizeMessage:e=>{let t,s=0;if("number"!=typeof e[0].size)return"";for(t=0;t<e.length;t++)e[t].size&&(s+=e[t].size||0);return s/=1024,s<1024?s.toFixed(2)+" KB":(s/1024).toFixed(2)+" MB"},getAllFileInfo:e=>{const t=new Array;let s;for(s=0;s<e.length;s++)t.push(H(e[s]));return t},getFileInfo:H,getFileExtension:j,htmlEncode:K,assignGuidToFiles:(e,t)=>{const o=s.guid();return e.map(e=>(e.uid=t?o:s.guid(),e))},getFileStatus:e=>{let t=!1,s=!1,o=!1,n=!1;const i=e=>{e.forEach(e=>{e.status===p.Uploading&&(t=!0),e.status===p.Uploaded&&(s=!0),e.status===p.UploadFailed&&(o=!0),P(e)&&(n=!0)})};return Array.isArray(e)?i(e):Object.keys(e).forEach(t=>{i(e[t])}),[t,s,o,n]}};let q=class extends c.Component{constructor(e){super(e),this.buttonClassNames=e=>{const{actionFocused:t,retryFocused:o}=this.state;return s.classNames("k-icon-button k-upload-action",this.props.disabled?"k-disabled":"",t&&"action"===e||o&&"retry"===e?"k-focus":"")},this.onRetryFocus=()=>{this.setState({retryFocused:!0})},this.onRetryBlur=()=>{this.setState({retryFocused:!1})},this.onActionFocus=()=>{this.setState({actionFocused:!0})},this.onActionBlur=()=>{this.setState({actionFocused:!1})},this.onActionClick=()=>{const{status:e,uid:t,disabled:s,onCancel:o,onRemove:n}=this.props;s||e===p.Removing||(e===p.Uploading?o.call(void 0,t):n.call(void 0,t))},this.onRetryClick=()=>{const{uid:e,disabled:t,onRetry:s}=this.props;t||s.call(void 0,e)},this.state={retryFocused:!1,actionFocused:!1}}actionButtonTitle(e,t){return e===p.Uploading?t.toLanguageString(u,A[u]):t.toLanguageString(F,A[F])}retryButtonTitle(e){return e.toLanguageString(b,A[b])}render(){const{status:e,progress:t}=this.props,s=e===p.UploadFailed,o=e===p.Uploading,l=(e===p.Uploaded||e===p.Initial)&&!this.props.async.removeUrl,r=n.provideLocalizationService(this);return c.createElement("span",{className:"k-upload-actions"},o?c.createElement("span",{className:"k-upload-pct"},t,"%"):void 0,s?c.createElement(i.Button,{type:"button",fillMode:"flat",tabIndex:-1,className:this.buttonClassNames("retry"),onFocus:this.onRetryFocus,onBlur:this.onRetryBlur,onClick:this.onRetryClick,"aria-label":this.retryButtonTitle(r),title:this.retryButtonTitle(r),icon:"arrow-rotate-cw-small",svgIcon:a.arrowRotateCwSmallIcon}):void 0,l?void 0:c.createElement(i.Button,{type:"button",fillMode:"flat",tabIndex:-1,className:this.buttonClassNames("action"),onFocus:this.onActionFocus,onBlur:this.onActionBlur,onClick:this.onActionClick,"aria-label":this.actionButtonTitle(e,r),"aria-hidden":!0,title:this.actionButtonTitle(e,r),icon:e===p.Uploading?"cancel":"x",svgIcon:e===p.Uploading?a.cancelIcon:a.xIcon}))}};n.registerForLocalization(q);let G=class extends c.Component{getFileExtension(e){return e.extension?e.extension.substring(1):""}getFileValidationMessage(e,t){const s=n.provideLocalizationService(this);let o="";if(t)o=s.toLanguageString(w,A[w]);else if(e.validationErrors&&e.validationErrors.length>0){const t=`upload.${e.validationErrors[0]}`;o=s.toLanguageString(t,A[t])}return o}renderValidationError(e,t){return c.createElement("span",{className:"k-file-info",key:"2"},c.createElement("span",{className:"k-file-name",title:e.name},e.name),c.createElement("span",{className:"k-file-validation-message","aria-live":"polite"},this.getFileValidationMessage(e,t)))}renderFileDetails(e){const t=n.provideLocalizationService(this).toLanguageString(R,A[R]);return c.createElement("span",{className:"k-file-info",key:"2"},c.createElement("span",{className:"k-file-name",title:e.name},e.name),100!==e.progress?c.createElement("span",{className:"k-file-size"},$.getTotalFilesSizeMessage([e])):c.createElement("span",{className:"k-file-validation-message","aria-live":"polite"},t))}render(){const{files:e,...t}=this.props,n=e[0],[,i,a,l]=$.getFileStatus([n]),r=!l&&!i&&!a;return c.createElement("div",{className:s.classNames("k-file-single")},r&&c.createElement(o.ProgressBar,{value:n.progress||0,tabIndex:-1}),c.createElement("span",{className:"k-file-icon-wrapper",key:"1"},c.createElement(s.IconWrap,{className:"k-file-icon",...s.getFileExtensionIcon(n.extension),size:"xxlarge"}),c.createElement("span",{className:"k-file-state"})),l||a?this.renderValidationError(n,a):this.renderFileDetails(n),c.createElement(q,{uid:n.uid,status:n.status,progress:n.progress,...t}))}};n.registerForLocalization(G);class V extends c.Component{constructor(){super(...arguments),this.mapFiles=()=>{const{files:e}=this.props;return e.map(e=>c.createElement("span",{key:e.name,className:"k-file-info"},c.createElement("span",{className:"k-file-name",title:e.name},e.name),$.fileHasValidationErrors(e)?c.createElement("span",{className:"k-file-validation-message","aria-live":"polite"},this.getFileValidationMessage(e)):c.createElement("span",{key:`${e.name}-size`,className:"k-file-size"},$.getTotalFilesSizeMessage([e]))))},this.progress=()=>{const{files:e}=this.props;let t=0;return e.forEach(e=>{t+=e.progress||0}),t/e.length}}getFileValidationMessage(e){const t=n.provideLocalizationService(this);let s="";if(e.validationErrors&&e.validationErrors.length>0){const o=`upload.${e.validationErrors[0]}`;s=t.toLanguageString(o,A[o])}return s}render(){const{files:e,...t}=this.props,[,i,l,r]=$.getFileStatus(e),d=n.provideLocalizationService(this),p=d.toLanguageString(x,A[x]),u=d.toLanguageString(D,A[D]),h=d.toLanguageString(w,A[w]),m=d.toLanguageString(R,A[R]),g=this.progress();return c.createElement("div",{className:s.classNames("k-file-multiple")},!r&&!i&&!l&&c.createElement(o.ProgressBar,{value:g||0}),c.createElement("span",{className:"k-file-icon-wrapper"},c.createElement(s.IconWrap,{className:"k-file-icon",name:"copy",icon:a.copyIcon,size:"xxlarge"})),c.createElement("span",{className:"k-multiple-files-wrapper"},this.mapFiles(),l?c.createElement("span",{className:"k-file-validation-message","aria-live":"polite"},`${e.length} ${h}`):100!==g?c.createElement("span",{className:"k-file-summary"},`${p}: ${e.length} ${u}, ${$.getTotalFilesSizeMessage(e)}`):c.createElement("span",{className:"k-file-summary k-text-success"},`${e.length} ${m}`)),c.createElement(q,{uid:e[0].uid,status:e[0].status,progress:g,...t}))}}n.registerForLocalization(V);class W extends c.Component{constructor(){super(...arguments),this._element=null,this.onClick=()=>{this.props.onClick.call(void 0,this.props.index)}}componentDidUpdate(){const{navigationIndex:e,index:t}=this.props,o=s.getActiveElement(document);e===t&&this._element&&o!==this._element&&this._element.focus()}render(){const{files:e,async:t,disabled:o,navigationIndex:n,index:i,listItemUI:a,onCancel:l,onRemove:r,onRetry:d}=this.props,u=e[0],h=u.status===p.Uploaded||u.status===p.Initial,m=s.classNames("k-file",$.filesHaveValidationErrors(e)?"k-file-error k-file-invalid":"",u.status===p.UploadFailed||u.status===p.RemoveFailed?"k-file-error":"",u.status===p.Uploading?"k-file-progress":"",h?"k-file-success":"",n===i?"k-focus":""),g={async:t,disabled:o,onCancel:l,onRemove:r,onRetry:d},v=a||(1===e.length?G:V);return c.createElement("li",{ref:e=>{this._element=e},className:m,"data-uid":u.uid,onClick:this.onClick,role:"listitem"},c.createElement(v,{files:e,...g}))}}let Z=class extends c.Component{mapListGroups(){const{groupedFiles:e,navigationIndex:t,...s}=this.props;return Object.keys(e).map((o,n)=>{const i=e[o];return c.createElement(W,{key:o,files:i,index:n,navigationIndex:t,...s})})}render(){const e=s.classNames("k-upload-files");return c.createElement("ul",{className:e,role:"list",id:this.props.listId},this.mapListGroups())}};const J=/(chrome)[ \/]([\w.]+)/i,Q=/(webkit)[ \/]([\w.]+)/i;let X=class extends c.Component{constructor(){super(...arguments),this._input=null,this.onMouseDown=e=>{this.props.onMouseDown&&this.props.onMouseDown(e)},this.onAdd=()=>{const e=navigator.userAgent,t=this._input;t&&(this.props.onAdd&&t.files&&this.props.onAdd.call(void 0,t.files),!e.match(J)&&e.match(Q)||(t.type="",t.type="file"))}}get actionElement(){return this._input}render(){const{multiple:e,async:t,disabled:s,accept:o,hasFiles:i,ariaLabelledBy:a,ariaDescribedBy:l,id:r}=this.props,d=n.provideLocalizationService(this),p=i?U:I,u=d.toLanguageString(p,A[p]),h=d.toLanguageString(C,A[C]);return c.createElement("input",{id:r,ref:e=>{this._input=e},className:"k-hidden",autoComplete:"off",name:t.saveField,accept:o,type:"file",multiple:e,disabled:s,onChange:this.onAdd,onMouseDown:this.onMouseDown,title:u,tabIndex:-1,"data-testid":"upload-input-testid","aria-label":void 0!==a?void 0:h,"aria-labelledby":a,"aria-describedby":l,"aria-hidden":!0})}};n.registerForLocalization(X);const Y=e=>c.createElement("span",{"aria-hidden":!0},e.message);let ee=class extends c.Component{constructor(){super(...arguments),this._element=null,this._uploadInput=null,this.focus=()=>{this._element&&this._element.focus()},this.onClick=()=>{this.actionElement&&this.actionElement.click(),this.props.onClick.call(void 0,this.props.addButtonIndex)},this.onInputMouseDown=e=>{this._element&&(e.preventDefault(),this._element.focus())}}get actionElement(){if(this._uploadInput)return this._uploadInput.actionElement}componentDidUpdate(e){const{navigationIndex:t,addButtonIndex:s,notFocusedIndex:o}=this.props;t!==e.navigationIndex&&e.navigationIndex!==o&&t===s&&this._element&&this._element.focus()}render(){const{navigationIndex:e,addButtonIndex:t,tabIndex:o,id:a,ariaControls:l,disabled:r,ariaExpanded:d,selectMessageUI:p,...u}=this.props,h=n.provideLocalizationService(this).toLanguageString(C,A[C]),m=p||Y;return c.createElement("div",{className:"k-upload-button-wrap"},c.createElement(i.Button,{type:"button",id:a?`${a}-select-button`:"select-button",className:s.classNames("k-upload-button",e===t?"k-focus":""),tabIndex:o,onClick:this.onClick,"aria-label":h,"aria-controls":l,"aria-disabled":r,"aria-expanded":d},c.createElement(m,{message:h})),c.createElement(X,{id:a?`${a}-files`:"files",...u,onMouseDown:this.onInputMouseDown,ref:e=>{this._uploadInput=e}}))}};n.registerForLocalization(ee);let te=class extends c.Component{constructor(){super(...arguments),this._uploadElement=null,this._clearElement=null,this.onClearClick=()=>{this.props.disabled||this.props.onClear&&this.props.onClear.call(void 0)},this.checkEnterKey=e=>e.keyCode===s.Keys.enter,this.onUploadClick=()=>{this.props.disabled||(this.props.onClick.call(void 0,this.props.uploadButtonIndex),this.props.onUpload&&this.props.onUpload.call(void 0))}}componentDidUpdate(e){const{navigationIndex:t,clearButtonIndex:s,uploadButtonIndex:o}=this.props;t!==e.navigationIndex&&(t===s&&this._clearElement&&this._clearElement.focus(),t===o&&this._uploadElement&&this._uploadElement.focus())}render(){const{disabled:e,navigationIndex:t,clearButtonIndex:o,uploadButtonIndex:i,actionsLayout:a}=this.props,l=n.provideLocalizationService(this),r=s.classNames("k-actions","k-hstack",{"k-justify-content-start":"start"===a,"k-justify-content-center":"center"===a,"k-justify-content-end":"end"===a,"k-justify-content-stretch":"stretched"===a}),d=s.classNames("k-button k-button-md k-rounded-md k-button-solid k-button-base","k-clear-selected",e?"k-disabled":"",t===o?"k-focus":""),p=s.classNames("k-button k-button-md k-rounded-md k-button-solid k-button-primary","k-primary","k-upload-selected",e?"k-disabled":"",t===i?"k-focus":"");return c.createElement("div",{className:r},c.createElement("button",{ref:e=>{this._clearElement=e},type:"button",className:d,tabIndex:0,onClick:this.onClearClick,onKeyDown:e=>this.checkEnterKey(e)&&this.onClearClick()},l.toLanguageString(h,A[h])),c.createElement("button",{ref:e=>{this._uploadElement=e},type:"button",className:p,tabIndex:0,onClick:this.onUploadClick,onKeyDown:e=>this.checkEnterKey(e)&&this.onUploadClick()},l.toLanguageString(S,A[S])))}};n.registerForLocalization(te);let se=class extends c.Component{render(){const{isUploading:e,isUploaded:t,isUploadFailed:o}=this.props,i=s.classNames("k-upload-status"),l=e||o||!t?!e&&o?"exclamation-circle":e?"upload":"":"check",r=e||o||!t?!e&&o?{icon:a.exclamationCircleIcon}:e?{icon:a.uploadIcon}:{}:{icon:a.checkIcon};let d="";const p=n.provideLocalizationService(this);return e?d=p.toLanguageString(v,A[v]):(t||o)&&(d=p.toLanguageString(g,A[g])),c.createElement("div",{className:i},c.createElement(s.IconWrap,{name:l,...r}),d)}};n.registerForLocalization(se);class oe extends c.Component{constructor(){super(...arguments),this._lastDocumentDragOver=null,this._lastElementDragOver=null,this._documentActive=!1,this._elementActive=!1,this.onDocumentDragEnter=()=>{if(!this.documentActive){this.documentActive=!0;const e=()=>{this.isDragOver(this._lastDocumentDragOver)&&(this.documentActive=!1,clearInterval(this._documentInterval),this._documentInterval=null,this._lastDocumentDragOver=null)};this._documentInterval=setInterval(e,100)}},this.onDocumentDragOver=()=>{this._lastDocumentDragOver=new Date},this.onElementDragEnter=()=>{if(!this.elementActive){this.elementActive=!0;const e=()=>{this.isDragOver(this._lastElementDragOver)&&(this.elementActive=!1,clearInterval(this._elementInterval),this._elementInterval=null,this._lastElementDragOver=null)};this._elementInterval=setInterval(e,100)}},this.onElementDragOver=e=>{e.preventDefault(),this._lastElementDragOver=new Date},this.onDrop=e=>{e.preventDefault();const t=e.dataTransfer.files;t.length>0&&!this.props.disabled&&this.props.onAdd&&(this.props.multiple||t.length<=1)&&this.props.onAdd.call(void 0,t)},this.isDragOver=e=>(new Date).getTime()-(e||new Date).getTime()>100}get documentActive(){return this._documentActive}set documentActive(e){const t=this.documentActive;this._documentActive=e,e!==t&&this.forceUpdate()}get elementActive(){return this._elementActive}set elementActive(e){const t=this._elementActive;this._elementActive=e,e!==t&&this.setState({})}componentDidMount(){document.addEventListener("dragenter",this.onDocumentDragEnter),document.addEventListener("dragover",this.onDocumentDragOver)}componentWillUnmount(){document.removeEventListener("dragenter",this.onDocumentDragEnter),document.removeEventListener("dragover",this.onDocumentDragOver)}render(){const{addButtonComponent:e,fileGroup:t}=this.props,o=n.provideLocalizationService(this).toLanguageString(m,A[m]),i=s.classNames("k-dropzone k-upload-dropzone",this.documentActive?"k-dropzone-active":"",this.elementActive?"k-dropzone-hovered":""),[a,l,r,d]=$.getFileStatus(t),p=s.classNames("k-dropzone-hint",{});return c.createElement("div",{className:i,onDrop:this.onDrop,onDragEnter:this.onElementDragEnter,onDragOver:this.onElementDragOver},e,a||l||r||d?c.createElement(se,{isUploading:a,isUploaded:l,isUploadFailed:r}):c.createElement("div",{className:p},o))}}n.registerForLocalization(oe);const ne=class extends c.Component{constructor(){super(...arguments),this._container=null,this._uploadAddButton=null,this.focus=()=>{if(this._uploadAddButton)return this._uploadAddButton.focus()},this.onAdd=e=>{this.props.onAdd&&this.props.onAdd.call(void 0,e)},this.onRetry=e=>{this.props.onRetry&&this.props.onRetry.call(void 0,e)},this.onCancel=e=>{this.props.onCancel&&this.props.onCancel.call(void 0,e)},this.onClear=()=>{this.props.onClear&&this.props.onClear.call(void 0)},this.onUpload=()=>{this.props.onUpload&&this.props.onUpload.call(void 0)},this.onRemove=e=>{this.props.onRemove&&this.props.onRemove.call(void 0,e)},this.onKeyDown=e=>{this.props.onKeyDown&&this.props.onKeyDown.call(void 0,e,this.isRtl)},this.onFocus=e=>{this.props.onFocus&&this.props.onFocus.call(void 0,e)},this.onBlur=e=>{this.props.onBlur&&this.props.onBlur.call(void 0,e)},this.onClick=e=>{this.props.onClick&&this.props.onClick.call(void 0,e)}}get async(){const{autoUpload:e,batch:t,withCredentials:s,saveField:o,saveHeaders:n,saveMethod:i,saveUrl:a,responseType:l,removeField:r,removeHeaders:d,removeMethod:c,removeUrl:p}=this.props;return{autoUpload:e,batch:t,withCredentials:s,saveField:o,saveHeaders:n,saveMethod:i,saveUrl:a,responseType:l,removeField:r,removeHeaders:d,removeMethod:c,removeUrl:p}}get groupsCount(){return Object.keys(this.props.groupedFiles).length}get lastGroupIndex(){return this.groupsCount-1}get addButtonIndex(){return-1}get clearButtonIndex(){return this.lastGroupIndex+1}get uploadButtonIndex(){return this.lastGroupIndex+2}get isRtl(){return this._container&&"rtl"===getComputedStyle(this._container).direction||!1}get actionElement(){if(this._uploadAddButton)return this._uploadAddButton.actionElement}render(){const{multiple:e,disabled:t,tabIndex:o,accept:n,showFileList:i,groupedFiles:a,navigationIndex:l,showActionButtons:r,actionsLayout:d,notFocusedIndex:p,listItemUI:u,id:h,ariaLabelledBy:m,ariaDescribedBy:g,selectMessageUI:v}=this.props,f=s.classNames("k-upload",{"k-upload-empty":0===Object.keys(a).length},this.props.className,t?"k-disabled":""),y=`${h}-list`,E=c.createElement(ee,{id:h,ariaLabelledBy:m,ariaDescribedBy:g,ref:e=>{this._uploadAddButton=e},accept:n,async:this.async,addButtonIndex:this.addButtonIndex,navigationIndex:l,notFocusedIndex:p,tabIndex:o,multiple:e,disabled:t,hasFiles:!!a&&Object.keys(a).length>0,selectMessageUI:v,onAdd:this.onAdd,onClick:this.onClick,ariaControls:y,ariaExpanded:i});return c.createElement("div",{ref:e=>{this._container=e},className:f,onKeyDown:this.onKeyDown,onFocus:this.onFocus,onBlur:this.onBlur},c.createElement(oe,{addButtonComponent:E,fileGroup:a,disabled:t,multiple:e,onAdd:this.onAdd}),i?c.createElement(Z,{groupedFiles:a,disabled:t,async:this.async,navigationIndex:l,listItemUI:u,onCancel:this.onCancel,onRemove:this.onRemove,onRetry:this.onRetry,onClick:this.onClick,listId:y}):void 0,r?c.createElement(te,{disabled:t,navigationIndex:l,clearButtonIndex:this.clearButtonIndex,uploadButtonIndex:this.uploadButtonIndex,actionsLayout:d,onUpload:this.onUpload,onClear:this.onClear,onClick:this.onClick}):void 0)}};ne.defaultProps={disabled:!1,groupedFiles:{},multiple:!0,actionsLayout:"end"};let ie=ne;const ae=s.withIdHOC(ie);ae.displayName="KendoReactUploadUI";const le=-2,re=-1;class de extends c.Component{constructor(e){super(e),this._uploadUI=null,this.focus=()=>{this._uploadUI&&this._uploadUI.focus()},this.onKeyDown=(e,t)=>{const o=this.navIndex,n=Object.keys(this.props.groupedFiles),i=n.length-1,a=this.props.autoUpload||0===n.length?i:i+1,l=i+1,r=l+1,d=o===le?re:o;let c=o;switch(e.keyCode){case s.Keys.up:o>-1&&(c=d-1);break;case s.Keys.down:o<a&&(c=d+1);break;case s.Keys.left:t?o===l&&(c=d+1):o===r&&(c=d-1);break;case s.Keys.right:t?o===r&&(c=d-1):o===l&&(c=d+1);break;case s.Keys.enter:if(o===re||o===le){const e=s.getActiveElement(document);this.actionElement&&s.canUseDOM&&-1===(null==e?void 0:e.className.indexOf("k-upload-button"))&&-1===(null==e?void 0:e.className.indexOf("k-upload-selected"))&&-1===(null==e?void 0:e.className.indexOf("k-clear-selected"))&&this.actionElement.click()}o>=0&&o<=i&&this.onRetry(n[o]);break;case s.Keys.space:(o===re||o===le)&&this.actionElement&&this.actionElement.click(),e.preventDefault();break;case s.Keys.tab:c=le;break;case s.Keys.delete:o>=0&&o<=i&&(c=d-1,this.onRemove(n[o]));break;case s.Keys.esc:o>=0&&o<=i&&(c=d-1,this.onCancel(n[o]))}this.navIndex=c},this.onCancel=e=>{this.props.onCancel&&this.props.onCancel.call(void 0,e)},this.onClear=()=>{this.navIndex=re,this.props.onClear&&this.props.onClear.call(void 0)},this.onUpload=()=>{this.navIndex=re,this.props.onUpload&&this.props.onUpload.call(void 0)},this.onRetry=e=>{this.props.onRetry&&this.props.onRetry.call(void 0,e)},this.onRemove=e=>{this.navIndex=this.navIndex>re?this.navIndex-1:re,this.props.onRemove&&this.props.onRemove.call(void 0,e)},this.onAdd=e=>{this.navIndex=re,this.props.onAdd&&this.props.onAdd.call(void 0,e)},this.onClick=e=>{this.navIndex=e},this.onFocus=()=>{this._blurTimeout&&(clearTimeout(this._blurTimeout),this._blurTimeout=void 0)},this.onBlurTimeout=()=>{this.navIndex=le,this._blurTimeout=void 0},this.onBlur=()=>{clearTimeout(this._blurTimeout),this._blurTimeout=window.setTimeout(this.onBlurTimeout)},this._navIndex=le}get navIndex(){return this._navIndex}set navIndex(e){const t=this.navIndex;this._navIndex=e,e!==t&&this.forceUpdate()}get actionElement(){if(this._uploadUI)return this._uploadUI.actionElement}componentDidUpdate(e){const t=Object.keys(e.groupedFiles).length,s=Object.keys(this.props.groupedFiles).length;t>s&&this.navIndex>re&&(this.navIndex=this.navIndex-(t-s))}render(){const{onClear:e,onRemove:t,onRetry:s,onCancel:o,onUpload:n,onAdd:i,...a}=this.props;return c.createElement(ae,{ref:e=>{this._uploadUI=e},className:this.props.className,onKeyDown:this.onKeyDown,navigationIndex:this.navIndex,notFocusedIndex:le,onAdd:this.onAdd,onClear:this.onClear,onUpload:this.onUpload,onRemove:this.onRemove,onRetry:this.onRetry,onCancel:this.onCancel,onClick:this.onClick,onFocus:this.onFocus,onBlur:this.onBlur,...a})}}const ce=(e,t)=>{t.push(e)},pe=(e,t)=>{Object.keys(e).forEach(s=>{t(e[s],s)})},ue={copyState:e=>(e||[]).map(e=>({...e})),addMany:(e,t)=>{e.forEach(e=>ce(e,t))},add:ce,groupFilesByUid:e=>{const t={};return e.forEach(e=>{t[e.uid]?t[e.uid].push(e):t[e.uid]=[e]}),t},filesForUpload:e=>{const t={};return pe(e,(e,s)=>{let o=!0;e.forEach(e=>{(e.status!==p.Selected||e.validationErrors&&e.validationErrors.length>0)&&(o=!1)}),o&&(t[s]=e)}),t},setFilesStatus:(e,t)=>{pe(e,e=>{e.forEach(e=>{e.status=t})})},flatFileGroup:e=>{const t=[];return pe(e,e=>{t.push.apply(t,e)}),t},groupForEach:pe},he=(e,t)=>{Object.keys(t).forEach(s=>{e.append(s,t[s])})},me=(e,t,s)=>{const o=new FormData;return he(o,s),e.forEach(e=>{const s=e.getRawFile?e.getRawFile():"";s?o.append(t,s,e.name):o.append(t,s)}),o},ge=(e,t,s)=>{const o=new FormData;return he(o,s),e.forEach(e=>{o.append(t,e)}),o},ve=(e,t)=>({headers:e,responseType:t.responseType,withCredentials:t.withCredentials}),fe=e=>{const t={};return Object.keys(e).forEach(s=>{t[s]=e[s]}),t},ye=e=>{const{data:t,config:s,...o}=e;return{response:t,...o}},Ee="invalidMaxFileSize",ke="invalidMinFileSize",Fe="invalidFileExtension",be=(e,t)=>{t.length>0&&t.indexOf((e.extension||"").toLowerCase())<0&&(e.validationErrors=e.validationErrors||[],e.validationErrors.indexOf(Fe)<0&&e.validationErrors.push(Fe))},Ce=(e,t,s)=>{0!==t&&(e.size||0)<t&&(e.validationErrors=e.validationErrors||[],e.validationErrors.indexOf(ke)<0&&e.validationErrors.push(ke)),0!==s&&(e.size||0)>s&&(e.validationErrors=e.validationErrors||[],e.validationErrors.indexOf(Ee)<0&&e.validationErrors.push(Ee))},Ue=(e,t)=>{const s=(e=>e.map(e=>("."===e.substring(0,1)?e:"."+e).toLowerCase()))(t.allowedExtensions||[]),o=t.maxFileSize||0,n=t.minFileSize||0;let i;for(i=0;i<e.length;i++)be(e[i],s),Ce(e[i],n,o)},Ie=Object.freeze({name:"@progress/kendo-react-upload",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate:0,version:"14.1.1",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"}),Se=class extends c.Component{constructor(e){super(e),this._httpSubscriptions={},this._uploadNavigation=null,this.showLicenseWatermark=!1,this.focus=()=>{this._uploadNavigation&&this._uploadNavigation.focus()},this.triggerUpload=()=>{this.onUpload()},this.uploadFiles=e=>{const t=this.async;ue.setFilesStatus(e,p.Uploading),ue.groupForEach(e,(e,s)=>{const o={target:this,files:e,headers:fe(t.saveHeaders||{}),additionalData:{}};this.props.onBeforeUpload&&this.props.onBeforeUpload.call(void 0,o);const n=ve(o.headers,this.async),i=me(e,t.saveField,o.additionalData);if(this.isCustomSave)this.props.saveUrl(e,{formData:i,requestOptions:n},this.onUploadProgress).then(e=>this.onUploadSuccess(e.uid)).catch(e=>this.onUploadError(e.uid));else{const e=r.CancelToken.source();this._httpSubscriptions[s]=e,r({method:t.saveMethod,url:t.saveUrl,data:i,cancelToken:e.token,...n,onUploadProgress:e=>this.onUploadProgress(s,e)}).then(e=>this.onUploadSuccess(s,e)).catch(e=>this.onUploadError(s,e))}})},this.removeFiles=e=>{const t=this.async;ue.groupForEach(e,(e,s)=>{const o={target:this,files:e,headers:fe(t.removeHeaders||{}),additionalData:{}};this.props.onBeforeRemove&&this.props.onBeforeRemove.call(void 0,o);const n=e.map(e=>e.name),i=ve(o.headers,this.async),a=ge(n,t.removeField,o.additionalData);this.isCustomRemove?this.props.removeUrl(e,{formData:a,requestOptions:i}).then(e=>this.onRemoveSuccess(e.uid)).catch(e=>this.onRemoveError(e.uid)):r({method:t.removeMethod,url:t.removeUrl,data:a,...i}).then(e=>this.onRemoveSuccess(s,e)).catch(e=>this.onRemoveError(s,e))})},this.onUpload=()=>{const e=this.fileStateCopy,t=ue.groupFilesByUid(e),s=ue.filesForUpload(t);this.uploadFiles(s);const o=()=>{if(this.props.onStatusChange){const t={target:this,newState:e,affectedFiles:ue.flatFileGroup(s)};this.props.onStatusChange.call(void 0,t)}};this.isControlled?o():this.setState({files:e},o)},this.onAdd=e=>{let t,s=$.getAllFileInfo(e);if(s=$.assignGuidToFiles(s,this.async.batch),Ue(s,this.props.restrictions),t=this.props.multiple?this.fileStateCopy:[],ue.addMany(s,t),this.async.autoUpload){const e=ue.groupFilesByUid(t);this.uploadFiles(ue.filesForUpload(e))}const o=()=>{if(this.props.onAdd){const e={target:this,newState:t,affectedFiles:s};this.props.onAdd.call(void 0,e)}};this.isControlled?o():this.setState({files:t},o)},this.onUploadProgress=(e,t)=>{const s=Math.round(100*t.loaded/(t.total||0))||0,o=()=>{if(this.props.onProgress){const t=this.fileStateCopy,o=t.filter(t=>t.uid===e);this.setFilesProgress(t,s);const n={target:this,newState:t,affectedFiles:o};this.props.onProgress.call(void 0,n)}};this.isControlled?o():this.setState(t=>{const o=t.files,n=o.filter(t=>t.uid===e);if(this.setFilesProgress(n,s),n.length)return{files:o}},o)},this.onUploadSuccess=(e,t)=>{const s=this.fileStateCopy,o=s.filter(t=>t.uid===e);o.forEach(e=>{e.status=p.Uploaded,e.progress=100}),delete this._httpSubscriptions[e];const n=()=>{if(this.props.onStatusChange){const e={target:this,newState:s,affectedFiles:o,response:t?ye(t):void 0};this.props.onStatusChange.call(void 0,e)}};this.isControlled?n():this.setState({files:s},n)},this.onUploadError=(e,t)=>{const s=this.fileStateCopy,o=s.filter(t=>t.uid===e);if(o.forEach(e=>{e.status=p.UploadFailed}),delete this._httpSubscriptions[e],!o.length)return;const n=()=>{if(this.props.onStatusChange){const e={target:this,newState:s,affectedFiles:o,response:t?ye(t):void 0};this.props.onStatusChange.call(void 0,e)}};this.isControlled?n():this.setState({files:s},n)},this.onRemove=e=>{const t=this.fileStateCopy,s=t.filter(t=>t.uid===e),o=t.filter(t=>t.uid!==e);if([p.Uploaded,p.Initial,p.RemoveFailed].indexOf(s[0].status)>-1){const o={[e]:s};ue.setFilesStatus(o,p.Removing),this.removeFiles(o);const n=()=>{if(this.props.onStatusChange){const e={target:this,newState:t,affectedFiles:s};this.props.onStatusChange.call(void 0,e)}};this.isControlled?n():this.setState({files:t},n)}else{const e=()=>{if(this.props.onRemove){const e={target:this,newState:o,affectedFiles:s};this.props.onRemove.call(void 0,e)}};this.isControlled?e():this.setState({files:o},e)}},this.onRemoveSuccess=(e,t)=>{const s=this.fileStateCopy,o=s.filter(t=>t.uid===e),n=s.filter(t=>t.uid!==e),i=()=>{if(this.props.onRemove){const e={target:this,newState:n,affectedFiles:o,response:t?ye(t):void 0};this.props.onRemove.call(void 0,e)}};this.isControlled?i():this.setState({files:n},i)},this.onRemoveError=(e,t)=>{const s=this.fileStateCopy,o=s.filter(t=>t.uid===e);o.forEach(e=>{e.status=p.RemoveFailed});const n=()=>{if(this.props.onStatusChange){const e={target:this,newState:s,affectedFiles:o,response:t?ye(t):void 0};this.props.onStatusChange.call(void 0,e)}};this.isControlled?n():this.setState({files:s},n)},this.onRetry=e=>{const t=this.fileStateCopy,s=ue.groupFilesByUid(t.filter(t=>t.uid===e));ue.setFilesStatus(s,p.Uploading),this.uploadFiles(s);const o=()=>{if(this.props.onStatusChange){const e={target:this,newState:t,affectedFiles:ue.flatFileGroup(s)};this.props.onStatusChange.call(void 0,e)}};this.isControlled?o():this.setState({files:t},o)},this.onCancel=e=>{const t=this.fileStateCopy,s=t.filter(t=>t.uid!==e),o=t.filter(t=>t.uid===e);if(this._httpSubscriptions[e]&&(this._httpSubscriptions[e].cancel(),delete this._httpSubscriptions[e]),this.props.onCancel){const t={target:this,uid:e};this.props.onCancel.call(void 0,t)}const n=()=>{if(this.props.onRemove){const e={target:this,newState:s,affectedFiles:o};this.props.onRemove.call(void 0,e)}};this.isControlled?n():this.setState({files:s},n)},this.onClear=()=>{if(!this.files.length)return;Object.keys(this._httpSubscriptions).forEach(e=>{this._httpSubscriptions[e].cancel()}),this._httpSubscriptions={};const e=()=>{if(this.props.onRemove){const e={target:this,newState:[],affectedFiles:this.fileStateCopy};this.props.onRemove.call(void 0,e)}};this.isControlled?e():this.setState({files:[]},e)},this.showLicenseWatermark=!s.validatePackage(Ie,{component:"Upload"}),this.licenseMessage=s.getLicenseMessage(Ie),this.state={files:e.defaultFiles||[]}}get async(){const{autoUpload:e,batch:t,removeField:s,removeHeaders:o,removeMethod:n,removeUrl:i,responseType:a,saveField:l,saveHeaders:r,saveMethod:d,saveUrl:c,withCredentials:p}=this.props;return{autoUpload:e,batch:t,removeField:s,removeHeaders:o,removeMethod:n,removeUrl:i,responseType:a,saveField:l,saveHeaders:r,saveMethod:d,saveUrl:c,withCredentials:p}}get files(){return(this.isControlled?this.props.files:this.state.files)||[]}get isControlled(){return!this.props.defaultFiles}get isCustomSave(){return this.props.saveUrl&&"function"==typeof this.props.saveUrl}get isCustomRemove(){return this.props.removeUrl&&"function"==typeof this.props.removeUrl}get fileStateCopy(){return this.isControlled?ue.copyState(this.props.files):ue.copyState(this.state.files)}get actionElement(){if(this._uploadNavigation)return this._uploadNavigation.actionElement}setFilesProgress(e,t){e.forEach(e=>{e.progress=t,e.status===p.Uploading&&100===t&&(e.status=p.Uploaded)})}render(){var e;const{showFileList:t,onAdd:o,onRemove:n,onCancel:i,autoUpload:a,showActionButtons:l,actionsLayout:r,tabIndex:d,disabled:p,...u}=this.props,h=ue.groupFilesByUid(this.files),m=ue.filesForUpload(h);return c.createElement(c.Fragment,null,c.createElement(de,{groupedFiles:h,className:this.props.className,showFileList:t&&!!Object.keys(h).length,showActionButtons:l&&!a&&(!!Object.keys(m).length||!(null==(e=this.props.defaultFiles)||!e.length)),actionsLayout:r,autoUpload:a,disabled:p,onAdd:this.onAdd,onRemove:this.onRemove,onClear:this.onClear,onUpload:this.onUpload,onRetry:this.onRetry,onCancel:this.onCancel,tabIndex:s.getTabIndex(d,p),ref:e=>{this._uploadNavigation=e},...u}),this.showLicenseWatermark&&c.createElement(s.WatermarkOverlay,{message:this.licenseMessage}))}};Se.defaultProps={autoUpload:!0,batch:!1,removeField:"fileNames",removeHeaders:{},removeMethod:"POST",removeUrl:"",responseType:"json",saveField:"files",saveHeaders:{},saveMethod:"POST",saveUrl:"",withCredentials:!0,restrictions:{allowedExtensions:[],maxFileSize:0,minFileSize:0},multiple:!0,showFileList:!0,showActionButtons:!0,actionsLayout:"end",disabled:!1},Se.propTypes={autoUpload:l.bool,batch:l.bool,withCredentials:l.bool,saveField:l.string,saveHeaders:l.object,saveMethod:l.string,saveUrl:l.oneOfType([l.string,l.func]),responseType:l.oneOf(["arraybuffer","blob","json","text"]),removeField:l.string,removeHeaders:l.object,removeMethod:l.string,removeUrl:l.oneOfType([l.string,l.func]),multiple:l.bool,disabled:l.bool,showFileList:l.bool,showActionButtons:l.bool,actionsLayout:l.oneOf(["start","center","end","stretched"]),tabIndex:l.number,accept:l.string,listItemUI:l.oneOfType([l.func,l.string,l.shape({render:l.func.isRequired})]),restrictions:l.shape({allowedExtensions:l.arrayOf(l.string),maxFileSize:l.number,minFileSize:l.number}),files:l.arrayOf(l.shape({uid:l.string,name:l.string,extension:l.string,size:l.number,validationErrors:l.arrayOf(l.string),status:l.oneOf([p.Initial,p.RemoveFailed,p.Removing,p.Selected,p.UploadFailed,p.Uploaded,p.Uploading]),progress:l.number,getRawFile:l.func})),defaultFiles:l.arrayOf(l.shape({uid:l.string,name:l.string,extension:l.string,size:l.number,validationErrors:l.arrayOf(l.string),status:l.oneOf([p.Initial,p.RemoveFailed,p.Removing,p.Selected,p.UploadFailed,p.Uploaded,p.Uploading]),progress:l.number,getRawFile:l.func}))};let xe=Se;const De=c.forwardRef((e,t)=>{const o=!s.validatePackage(Ie,{component:"ExternalDropZone"}),i=s.getLicenseMessage(Ie),l=c.useRef(null),r=c.useRef(null),d=c.useRef(null),p=c.useRef(!1),u=c.useRef(null),{uploadRef:h}=e,m=h.current,[g,v]=c.useState(!1),f=c.useMemo(()=>new n.IntlService("en"),[]),y=n.useLocalization(),E=y.toLanguageString(_,A[_]),[k,F]=c.useState(y.toLanguageString(N,A[N])),b=e.customHint||c.createElement("span",null,E),C=e.customNote||c.createElement("span",null,k),U=c.useCallback(()=>{r.current&&r.current.focus()},[r]);c.useImperativeHandle(l,()=>({element:r.current,focus:U,props:e})),c.useImperativeHandle(t,()=>l.current),c.useEffect(()=>{if(m){const e=m.props.restrictions.allowedExtensions;if(e&&e.length){const t=f.format(y.toLanguageString(B,A[B]),[e]);F(t)}}},[m,y,f]);const I=c.useCallback(e=>(new Date).getTime()-(e||new Date).getTime()>100,[]),S=c.useCallback(t=>{t.preventDefault();const s=t.dataTransfer.files;s.length>0&&!e.disabled&&h&&h.current&&(h.current.onAdd&&(t.preventDefault(),h.current.onAdd(s)),e.onDrop&&e.onDrop.call(void 0,t))},[e.disabled,h,e.onDrop]),x=c.useCallback(t=>{if(p){p.current=!0;const e=()=>{I(u.current)&&(v(!1),p.current=!1,clearInterval(d.current),d.current=null,u.current=null)};d.current=setInterval(e,100)}e.onElementDragEnter&&e.onElementDragEnter.call(void 0,t)},[p,d,u,I,e.onElementDragEnter]),D=c.useCallback(t=>{t.preventDefault(),u.current=new Date,v(!0),e.onElementDragOver&&e.onElementDragOver.call(void 0,t)},[u,e.onElementDragOver]);return c.createElement("div",{ref:r,id:e.id,className:s.classNames("k-external-dropzone",{"k-external-dropzone-hover":g,"k-disabled":e.disabled},e.className),tabIndex:s.getTabIndex(e.tabIndex,e.disabled,void 0),onDrop:S,onDragEnter:x,onDragOver:D},c.createElement("div",{style:e.style,className:"k-dropzone-inner"},c.createElement(s.IconWrap,{name:"upload",icon:a.uploadIcon,className:"k-dropzone-icon",size:"xxxlarge"}),c.createElement("span",{className:"k-dropzone-hint"},b),c.createElement("span",{className:"k-dropzone-note"},C)),o&&c.createElement(s.WatermarkOverlay,{message:i}))}),Re={id:l.string,tabIndex:l.number,editorRef:l.oneOfType([l.func,l.shape({current:l.any})]),disabled:l.bool,onDrop:l.func,onElementDragEnter:l.func,onElementDragOver:l.func};De.displayName="KendoReactExternalDropZone",De.propTypes=Re,e.ExternalDropZone=De,e.Upload=xe,e.UploadActionButtons=te,e.UploadAddButton=ee,e.UploadDropZone=oe,e.UploadFileStatus=p,e.UploadInput=X,e.UploadList=Z,e.UploadListActionButton=q,e.UploadListGroup=W,e.UploadListMultiItem=V,e.UploadListSingleItem=G,e.UploadStatus=se,e.UploadUI=ae,e.headerStatusUploaded=g,e.headerStatusUploading=v,e.invalidMaxFileSize=E,e.uploadMessages=A,e.uploadSelect=C,e.uploadUtils=$});
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("@progress/kendo-react-common"),require("@progress/kendo-react-progressbars"),require("@progress/kendo-react-intl"),require("@progress/kendo-react-buttons"),require("@progress/kendo-svg-icons"),require("prop-types"),require("axios")):"function"==typeof define&&define.amd?define(["exports","react","@progress/kendo-react-common","@progress/kendo-react-progressbars","@progress/kendo-react-intl","@progress/kendo-react-buttons","@progress/kendo-svg-icons","prop-types","axios"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).KendoReactUpload={},e.React,e.KendoReactCommon,e.KendoReactProgressbars,e.KendoReactIntl,e.KendoReactButtons,e.KendoSvgIcons,e.PropTypes,e.axios)}(this,function(e,t,s,o,n,i,a,l,r){"use strict";function d(e){var t=Object.create(null);return e&&Object.keys(e).forEach(function(s){if("default"!==s){var o=Object.getOwnPropertyDescriptor(e,s);Object.defineProperty(t,s,o.get?o:{enumerable:!0,get:function(){return e[s]}})}}),t.default=e,Object.freeze(t)}var c=d(t),p=(e=>(e[e.UploadFailed=0]="UploadFailed",e[e.Initial=1]="Initial",e[e.Selected=2]="Selected",e[e.Uploading=3]="Uploading",e[e.Uploaded=4]="Uploaded",e[e.RemoveFailed=5]="RemoveFailed",e[e.Removing=6]="Removing",e))(p||{});const u="upload.cancel",h="upload.clearSelectedFiles",m="upload.dropFilesHere",g="upload.headerStatusUploaded",v="upload.headerStatusUploading",f="upload.invalidFileExtension",y="upload.invalidFiles",E="upload.invalidMaxFileSize",k="upload.invalidMinFileSize",F="upload.remove",b="upload.retry",C="upload.select",U="upload.selectTitle",I="upload.selectNoFilesTitle",S="upload.uploadSelectedFiles",x="upload.total",D="upload.files",R="upload.statusUploaded",w="upload.statusUploadFailed",_="upload.dropZoneHint",N="upload.defaultDropZoneNote",B="upload.dropZoneNote",A={[u]:"Cancel",[h]:"Clear",[m]:"Drop files here to upload",[g]:"Done",[v]:"Uploading...",[f]:"File type not allowed.",[y]:"Invalid file(s). Please check file upload requirements.",[E]:"File size too large.",[k]:"File size too small.",[F]:"Remove",[b]:"Retry",[C]:"Select files...",[U]:"Press to select more files",[I]:"No files selected",[S]:"Upload",[x]:"Total",[D]:"files",[R]:"File(s) successfully uploaded.",[w]:"File(s) failed to upload.",[_]:"Drag and drop files here to upload.",[N]:"",[B]:"Only {0} files are allowed."},O=/&/g,L=/</g,z=/"/g,T=/'/g,M=/>/g,K=e=>(""+e).replace(O,"&amp;").replace(L,"&lt;").replace(M,"&gt;").replace(z,"&quot;").replace(T,"&#39;"),j=e=>{const t=e.match(/\.([^\.]+)$/);return t?t[0]:""},H=e=>{const t=e.name,s=e.size;return{extension:j(t),name:K(t),getRawFile:()=>e,size:s,status:p.Selected,progress:0,uid:""}},P=e=>!!(e.validationErrors&&e.validationErrors.length>0),$={fileHasValidationErrors:P,filesHaveValidationErrors:e=>{for(const t of e)if(P(t))return!0;return!1},getTotalFilesSizeMessage:e=>{let t,s=0;if("number"!=typeof e[0].size)return"";for(t=0;t<e.length;t++)e[t].size&&(s+=e[t].size||0);return s/=1024,s<1024?s.toFixed(2)+" KB":(s/1024).toFixed(2)+" MB"},getAllFileInfo:e=>{const t=new Array;let s;for(s=0;s<e.length;s++)t.push(H(e[s]));return t},getFileInfo:H,getFileExtension:j,htmlEncode:K,assignGuidToFiles:(e,t)=>{const o=s.guid();return e.map(e=>(e.uid=t?o:s.guid(),e))},getFileStatus:e=>{let t=!1,s=!1,o=!1,n=!1;const i=e=>{e.forEach(e=>{e.status===p.Uploading&&(t=!0),e.status===p.Uploaded&&(s=!0),e.status===p.UploadFailed&&(o=!0),P(e)&&(n=!0)})};return Array.isArray(e)?i(e):Object.keys(e).forEach(t=>{i(e[t])}),[t,s,o,n]}};let q=class extends c.Component{constructor(e){super(e),this.buttonClassNames=e=>{const{actionFocused:t,retryFocused:o}=this.state;return s.classNames("k-icon-button k-upload-action",this.props.disabled?"k-disabled":"",t&&"action"===e||o&&"retry"===e?"k-focus":"")},this.onRetryFocus=()=>{this.setState({retryFocused:!0})},this.onRetryBlur=()=>{this.setState({retryFocused:!1})},this.onActionFocus=()=>{this.setState({actionFocused:!0})},this.onActionBlur=()=>{this.setState({actionFocused:!1})},this.onActionClick=()=>{const{status:e,uid:t,disabled:s,onCancel:o,onRemove:n}=this.props;s||e===p.Removing||(e===p.Uploading?o.call(void 0,t):n.call(void 0,t))},this.onRetryClick=()=>{const{uid:e,disabled:t,onRetry:s}=this.props;t||s.call(void 0,e)},this.state={retryFocused:!1,actionFocused:!1}}actionButtonTitle(e,t){return e===p.Uploading?t.toLanguageString(u,A[u]):t.toLanguageString(F,A[F])}retryButtonTitle(e){return e.toLanguageString(b,A[b])}render(){const{status:e,progress:t}=this.props,s=e===p.UploadFailed,o=e===p.Uploading,l=(e===p.Uploaded||e===p.Initial)&&!this.props.async.removeUrl,r=n.provideLocalizationService(this);return c.createElement("span",{className:"k-upload-actions"},o?c.createElement("span",{className:"k-upload-pct"},t,"%"):void 0,s?c.createElement(i.Button,{type:"button",fillMode:"flat",tabIndex:-1,className:this.buttonClassNames("retry"),onFocus:this.onRetryFocus,onBlur:this.onRetryBlur,onClick:this.onRetryClick,"aria-label":this.retryButtonTitle(r),title:this.retryButtonTitle(r),icon:"arrow-rotate-cw-small",svgIcon:a.arrowRotateCwSmallIcon}):void 0,l?void 0:c.createElement(i.Button,{type:"button",fillMode:"flat",tabIndex:-1,className:this.buttonClassNames("action"),onFocus:this.onActionFocus,onBlur:this.onActionBlur,onClick:this.onActionClick,"aria-label":this.actionButtonTitle(e,r),"aria-hidden":!0,title:this.actionButtonTitle(e,r),icon:e===p.Uploading?"cancel":"x",svgIcon:e===p.Uploading?a.cancelIcon:a.xIcon}))}};n.registerForLocalization(q);let G=class extends c.Component{getFileExtension(e){return e.extension?e.extension.substring(1):""}getFileValidationMessage(e,t){const s=n.provideLocalizationService(this);let o="";if(t)o=s.toLanguageString(w,A[w]);else if(e.validationErrors&&e.validationErrors.length>0){const t=`upload.${e.validationErrors[0]}`;o=s.toLanguageString(t,A[t])}return o}renderValidationError(e,t){return c.createElement("span",{className:"k-file-info",key:"2"},c.createElement("span",{className:"k-file-name",title:e.name},e.name),c.createElement("span",{className:"k-file-validation-message","aria-live":"polite"},this.getFileValidationMessage(e,t)))}renderFileDetails(e){const t=n.provideLocalizationService(this).toLanguageString(R,A[R]);return c.createElement("span",{className:"k-file-info",key:"2"},c.createElement("span",{className:"k-file-name",title:e.name},e.name),100!==e.progress?c.createElement("span",{className:"k-file-size"},$.getTotalFilesSizeMessage([e])):c.createElement("span",{className:"k-file-validation-message","aria-live":"polite"},t))}render(){const{files:e,...t}=this.props,n=e[0],[,i,a,l]=$.getFileStatus([n]),r=!l&&!i&&!a;return c.createElement("div",{className:s.classNames("k-file-single")},r&&c.createElement(o.ProgressBar,{value:n.progress||0,tabIndex:-1}),c.createElement("span",{className:"k-file-icon-wrapper",key:"1"},c.createElement(s.IconWrap,{className:"k-file-icon",...s.getFileExtensionIcon(n.extension),size:"xxlarge"}),c.createElement("span",{className:"k-file-state"})),l||a?this.renderValidationError(n,a):this.renderFileDetails(n),c.createElement(q,{uid:n.uid,status:n.status,progress:n.progress,...t}))}};n.registerForLocalization(G);class V extends c.Component{constructor(){super(...arguments),this.mapFiles=()=>{const{files:e}=this.props;return e.map(e=>c.createElement("span",{key:e.name,className:"k-file-info"},c.createElement("span",{className:"k-file-name",title:e.name},e.name),$.fileHasValidationErrors(e)?c.createElement("span",{className:"k-file-validation-message","aria-live":"polite"},this.getFileValidationMessage(e)):c.createElement("span",{key:`${e.name}-size`,className:"k-file-size"},$.getTotalFilesSizeMessage([e]))))},this.progress=()=>{const{files:e}=this.props;let t=0;return e.forEach(e=>{t+=e.progress||0}),t/e.length}}getFileValidationMessage(e){const t=n.provideLocalizationService(this);let s="";if(e.validationErrors&&e.validationErrors.length>0){const o=`upload.${e.validationErrors[0]}`;s=t.toLanguageString(o,A[o])}return s}render(){const{files:e,...t}=this.props,[,i,l,r]=$.getFileStatus(e),d=n.provideLocalizationService(this),p=d.toLanguageString(x,A[x]),u=d.toLanguageString(D,A[D]),h=d.toLanguageString(w,A[w]),m=d.toLanguageString(R,A[R]),g=this.progress();return c.createElement("div",{className:s.classNames("k-file-multiple")},!r&&!i&&!l&&c.createElement(o.ProgressBar,{value:g||0}),c.createElement("span",{className:"k-file-icon-wrapper"},c.createElement(s.IconWrap,{className:"k-file-icon",name:"copy",icon:a.copyIcon,size:"xxlarge"})),c.createElement("span",{className:"k-multiple-files-wrapper"},this.mapFiles(),l?c.createElement("span",{className:"k-file-validation-message","aria-live":"polite"},`${e.length} ${h}`):100!==g?c.createElement("span",{className:"k-file-summary"},`${p}: ${e.length} ${u}, ${$.getTotalFilesSizeMessage(e)}`):c.createElement("span",{className:"k-file-summary k-text-success"},`${e.length} ${m}`)),c.createElement(q,{uid:e[0].uid,status:e[0].status,progress:g,...t}))}}n.registerForLocalization(V);class W extends c.Component{constructor(){super(...arguments),this._element=null,this.onClick=()=>{this.props.onClick.call(void 0,this.props.index)}}componentDidUpdate(){const{navigationIndex:e,index:t}=this.props,o=s.getActiveElement(document);e===t&&this._element&&o!==this._element&&this._element.focus()}render(){const{files:e,async:t,disabled:o,navigationIndex:n,index:i,listItemUI:a,onCancel:l,onRemove:r,onRetry:d}=this.props,u=e[0],h=u.status===p.Uploaded||u.status===p.Initial,m=s.classNames("k-file",$.filesHaveValidationErrors(e)?"k-file-error k-file-invalid":"",u.status===p.UploadFailed||u.status===p.RemoveFailed?"k-file-error":"",u.status===p.Uploading?"k-file-progress":"",h?"k-file-success":"",n===i?"k-focus":""),g={async:t,disabled:o,onCancel:l,onRemove:r,onRetry:d},v=a||(1===e.length?G:V);return c.createElement("li",{ref:e=>{this._element=e},className:m,"data-uid":u.uid,onClick:this.onClick,role:"listitem"},c.createElement(v,{files:e,...g}))}}let Z=class extends c.Component{mapListGroups(){const{groupedFiles:e,navigationIndex:t,...s}=this.props;return Object.keys(e).map((o,n)=>{const i=e[o];return c.createElement(W,{key:o,files:i,index:n,navigationIndex:t,...s})})}render(){const e=s.classNames("k-upload-files");return c.createElement("ul",{className:e,role:"list",id:this.props.listId},this.mapListGroups())}};const J=/(chrome)[ \/]([\w.]+)/i,Q=/(webkit)[ \/]([\w.]+)/i;let X=class extends c.Component{constructor(){super(...arguments),this._input=null,this.onMouseDown=e=>{this.props.onMouseDown&&this.props.onMouseDown(e)},this.onAdd=()=>{const e=navigator.userAgent,t=this._input;t&&(this.props.onAdd&&t.files&&this.props.onAdd.call(void 0,t.files),!e.match(J)&&e.match(Q)||(t.type="",t.type="file"))}}get actionElement(){return this._input}render(){const{multiple:e,async:t,disabled:s,accept:o,hasFiles:i,ariaLabelledBy:a,ariaDescribedBy:l,id:r}=this.props,d=n.provideLocalizationService(this),p=i?U:I,u=d.toLanguageString(p,A[p]),h=d.toLanguageString(C,A[C]);return c.createElement("input",{id:r,ref:e=>{this._input=e},className:"k-hidden",autoComplete:"off",name:t.saveField,accept:o,type:"file",multiple:e,disabled:s,onChange:this.onAdd,onMouseDown:this.onMouseDown,title:u,tabIndex:-1,"data-testid":"upload-input-testid","aria-label":void 0!==a?void 0:h,"aria-labelledby":a,"aria-describedby":l,"aria-hidden":!0})}};n.registerForLocalization(X);const Y=e=>c.createElement("span",{"aria-hidden":!0},e.message);let ee=class extends c.Component{constructor(){super(...arguments),this._element=null,this._uploadInput=null,this.focus=()=>{this._element&&this._element.focus()},this.onClick=()=>{this.actionElement&&this.actionElement.click(),this.props.onClick.call(void 0,this.props.addButtonIndex)},this.onInputMouseDown=e=>{this._element&&(e.preventDefault(),this._element.focus())}}get actionElement(){if(this._uploadInput)return this._uploadInput.actionElement}componentDidUpdate(e){const{navigationIndex:t,addButtonIndex:s,notFocusedIndex:o}=this.props;t!==e.navigationIndex&&e.navigationIndex!==o&&t===s&&this._element&&this._element.focus()}render(){const{navigationIndex:e,addButtonIndex:t,tabIndex:o,id:a,ariaControls:l,disabled:r,ariaExpanded:d,selectMessageUI:p,...u}=this.props,h=n.provideLocalizationService(this).toLanguageString(C,A[C]),m=p||Y;return c.createElement("div",{className:"k-upload-button-wrap"},c.createElement(i.Button,{type:"button",id:a?`${a}-select-button`:"select-button",className:s.classNames("k-upload-button",e===t?"k-focus":""),tabIndex:o,onClick:this.onClick,"aria-label":h,"aria-controls":l,"aria-disabled":r,"aria-expanded":d},c.createElement(m,{message:h})),c.createElement(X,{id:a?`${a}-files`:"files",...u,onMouseDown:this.onInputMouseDown,ref:e=>{this._uploadInput=e}}))}};n.registerForLocalization(ee);let te=class extends c.Component{constructor(){super(...arguments),this._uploadElement=null,this._clearElement=null,this.onClearClick=()=>{this.props.disabled||this.props.onClear&&this.props.onClear.call(void 0)},this.checkEnterKey=e=>e.keyCode===s.Keys.enter,this.onUploadClick=()=>{this.props.disabled||(this.props.onClick.call(void 0,this.props.uploadButtonIndex),this.props.onUpload&&this.props.onUpload.call(void 0))}}componentDidUpdate(e){const{navigationIndex:t,clearButtonIndex:s,uploadButtonIndex:o}=this.props;t!==e.navigationIndex&&(t===s&&this._clearElement&&this._clearElement.focus(),t===o&&this._uploadElement&&this._uploadElement.focus())}render(){const{disabled:e,navigationIndex:t,clearButtonIndex:o,uploadButtonIndex:i,actionsLayout:a}=this.props,l=n.provideLocalizationService(this),r=s.classNames("k-actions","k-hstack",{"k-justify-content-start":"start"===a,"k-justify-content-center":"center"===a,"k-justify-content-end":"end"===a,"k-justify-content-stretch":"stretched"===a}),d=s.classNames("k-button k-button-md k-rounded-md k-button-solid k-button-base","k-clear-selected",e?"k-disabled":"",t===o?"k-focus":""),p=s.classNames("k-button k-button-md k-rounded-md k-button-solid k-button-primary","k-primary","k-upload-selected",e?"k-disabled":"",t===i?"k-focus":"");return c.createElement("div",{className:r},c.createElement("button",{ref:e=>{this._clearElement=e},type:"button",className:d,tabIndex:0,onClick:this.onClearClick,onKeyDown:e=>this.checkEnterKey(e)&&this.onClearClick()},l.toLanguageString(h,A[h])),c.createElement("button",{ref:e=>{this._uploadElement=e},type:"button",className:p,tabIndex:0,onClick:this.onUploadClick,onKeyDown:e=>this.checkEnterKey(e)&&this.onUploadClick()},l.toLanguageString(S,A[S])))}};n.registerForLocalization(te);let se=class extends c.Component{render(){const{isUploading:e,isUploaded:t,isUploadFailed:o}=this.props,i=s.classNames("k-upload-status"),l=e||o||!t?!e&&o?"exclamation-circle":e?"upload":"":"check",r=e||o||!t?!e&&o?{icon:a.exclamationCircleIcon}:e?{icon:a.uploadIcon}:{}:{icon:a.checkIcon};let d="";const p=n.provideLocalizationService(this);return e?d=p.toLanguageString(v,A[v]):(t||o)&&(d=p.toLanguageString(g,A[g])),c.createElement("div",{className:i},c.createElement(s.IconWrap,{name:l,...r}),d)}};n.registerForLocalization(se);class oe extends c.Component{constructor(){super(...arguments),this._lastDocumentDragOver=null,this._lastElementDragOver=null,this._documentActive=!1,this._elementActive=!1,this.onDocumentDragEnter=()=>{if(!this.documentActive){this.documentActive=!0;const e=()=>{this.isDragOver(this._lastDocumentDragOver)&&(this.documentActive=!1,clearInterval(this._documentInterval),this._documentInterval=null,this._lastDocumentDragOver=null)};this._documentInterval=setInterval(e,100)}},this.onDocumentDragOver=()=>{this._lastDocumentDragOver=new Date},this.onElementDragEnter=()=>{if(!this.elementActive){this.elementActive=!0;const e=()=>{this.isDragOver(this._lastElementDragOver)&&(this.elementActive=!1,clearInterval(this._elementInterval),this._elementInterval=null,this._lastElementDragOver=null)};this._elementInterval=setInterval(e,100)}},this.onElementDragOver=e=>{e.preventDefault(),this._lastElementDragOver=new Date},this.onDrop=e=>{e.preventDefault();const t=e.dataTransfer.files;t.length>0&&!this.props.disabled&&this.props.onAdd&&(this.props.multiple||t.length<=1)&&this.props.onAdd.call(void 0,t)},this.isDragOver=e=>(new Date).getTime()-(e||new Date).getTime()>100}get documentActive(){return this._documentActive}set documentActive(e){const t=this.documentActive;this._documentActive=e,e!==t&&this.forceUpdate()}get elementActive(){return this._elementActive}set elementActive(e){const t=this._elementActive;this._elementActive=e,e!==t&&this.setState({})}componentDidMount(){document.addEventListener("dragenter",this.onDocumentDragEnter),document.addEventListener("dragover",this.onDocumentDragOver)}componentWillUnmount(){document.removeEventListener("dragenter",this.onDocumentDragEnter),document.removeEventListener("dragover",this.onDocumentDragOver)}render(){const{addButtonComponent:e,fileGroup:t}=this.props,o=n.provideLocalizationService(this).toLanguageString(m,A[m]),i=s.classNames("k-dropzone k-upload-dropzone",this.documentActive?"k-dropzone-active":"",this.elementActive?"k-dropzone-hovered":""),[a,l,r,d]=$.getFileStatus(t),p=s.classNames("k-dropzone-hint",{});return c.createElement("div",{className:i,onDrop:this.onDrop,onDragEnter:this.onElementDragEnter,onDragOver:this.onElementDragOver},e,a||l||r||d?c.createElement(se,{isUploading:a,isUploaded:l,isUploadFailed:r}):c.createElement("div",{className:p},o))}}n.registerForLocalization(oe);const ne=class extends c.Component{constructor(){super(...arguments),this._container=null,this._uploadAddButton=null,this.focus=()=>{if(this._uploadAddButton)return this._uploadAddButton.focus()},this.onAdd=e=>{this.props.onAdd&&this.props.onAdd.call(void 0,e)},this.onRetry=e=>{this.props.onRetry&&this.props.onRetry.call(void 0,e)},this.onCancel=e=>{this.props.onCancel&&this.props.onCancel.call(void 0,e)},this.onClear=()=>{this.props.onClear&&this.props.onClear.call(void 0)},this.onUpload=()=>{this.props.onUpload&&this.props.onUpload.call(void 0)},this.onRemove=e=>{this.props.onRemove&&this.props.onRemove.call(void 0,e)},this.onKeyDown=e=>{this.props.onKeyDown&&this.props.onKeyDown.call(void 0,e,this.isRtl)},this.onFocus=e=>{this.props.onFocus&&this.props.onFocus.call(void 0,e)},this.onBlur=e=>{this.props.onBlur&&this.props.onBlur.call(void 0,e)},this.onClick=e=>{this.props.onClick&&this.props.onClick.call(void 0,e)}}get async(){const{autoUpload:e,batch:t,withCredentials:s,saveField:o,saveHeaders:n,saveMethod:i,saveUrl:a,responseType:l,removeField:r,removeHeaders:d,removeMethod:c,removeUrl:p}=this.props;return{autoUpload:e,batch:t,withCredentials:s,saveField:o,saveHeaders:n,saveMethod:i,saveUrl:a,responseType:l,removeField:r,removeHeaders:d,removeMethod:c,removeUrl:p}}get groupsCount(){return Object.keys(this.props.groupedFiles).length}get lastGroupIndex(){return this.groupsCount-1}get addButtonIndex(){return-1}get clearButtonIndex(){return this.lastGroupIndex+1}get uploadButtonIndex(){return this.lastGroupIndex+2}get isRtl(){return this._container&&"rtl"===getComputedStyle(this._container).direction||!1}get actionElement(){if(this._uploadAddButton)return this._uploadAddButton.actionElement}render(){const{multiple:e,disabled:t,tabIndex:o,accept:n,showFileList:i,groupedFiles:a,navigationIndex:l,showActionButtons:r,actionsLayout:d,notFocusedIndex:p,listItemUI:u,id:h,ariaLabelledBy:m,ariaDescribedBy:g,selectMessageUI:v}=this.props,f=s.classNames("k-upload",{"k-upload-empty":0===Object.keys(a).length},this.props.className,t?"k-disabled":""),y=`${h}-list`,E=c.createElement(ee,{id:h,ariaLabelledBy:m,ariaDescribedBy:g,ref:e=>{this._uploadAddButton=e},accept:n,async:this.async,addButtonIndex:this.addButtonIndex,navigationIndex:l,notFocusedIndex:p,tabIndex:o,multiple:e,disabled:t,hasFiles:!!a&&Object.keys(a).length>0,selectMessageUI:v,onAdd:this.onAdd,onClick:this.onClick,ariaControls:y,ariaExpanded:i});return c.createElement("div",{ref:e=>{this._container=e},className:f,onKeyDown:this.onKeyDown,onFocus:this.onFocus,onBlur:this.onBlur},c.createElement(oe,{addButtonComponent:E,fileGroup:a,disabled:t,multiple:e,onAdd:this.onAdd}),i?c.createElement(Z,{groupedFiles:a,disabled:t,async:this.async,navigationIndex:l,listItemUI:u,onCancel:this.onCancel,onRemove:this.onRemove,onRetry:this.onRetry,onClick:this.onClick,listId:y}):void 0,r?c.createElement(te,{disabled:t,navigationIndex:l,clearButtonIndex:this.clearButtonIndex,uploadButtonIndex:this.uploadButtonIndex,actionsLayout:d,onUpload:this.onUpload,onClear:this.onClear,onClick:this.onClick}):void 0)}};ne.defaultProps={disabled:!1,groupedFiles:{},multiple:!0,actionsLayout:"end"};let ie=ne;const ae=s.withIdHOC(ie);ae.displayName="KendoReactUploadUI";const le=-2,re=-1;class de extends c.Component{constructor(e){super(e),this._uploadUI=null,this.focus=()=>{this._uploadUI&&this._uploadUI.focus()},this.onKeyDown=(e,t)=>{const o=this.navIndex,n=Object.keys(this.props.groupedFiles),i=n.length-1,a=this.props.autoUpload||0===n.length?i:i+1,l=i+1,r=l+1,d=o===le?re:o;let c=o;switch(e.keyCode){case s.Keys.up:o>-1&&(c=d-1);break;case s.Keys.down:o<a&&(c=d+1);break;case s.Keys.left:t?o===l&&(c=d+1):o===r&&(c=d-1);break;case s.Keys.right:t?o===r&&(c=d-1):o===l&&(c=d+1);break;case s.Keys.enter:if(o===re||o===le){const e=s.getActiveElement(document);this.actionElement&&s.canUseDOM&&-1===(null==e?void 0:e.className.indexOf("k-upload-button"))&&-1===(null==e?void 0:e.className.indexOf("k-upload-selected"))&&-1===(null==e?void 0:e.className.indexOf("k-clear-selected"))&&this.actionElement.click()}o>=0&&o<=i&&this.onRetry(n[o]);break;case s.Keys.space:(o===re||o===le)&&this.actionElement&&this.actionElement.click(),e.preventDefault();break;case s.Keys.tab:c=le;break;case s.Keys.delete:o>=0&&o<=i&&(c=d-1,this.onRemove(n[o]));break;case s.Keys.esc:o>=0&&o<=i&&(c=d-1,this.onCancel(n[o]))}this.navIndex=c},this.onCancel=e=>{this.props.onCancel&&this.props.onCancel.call(void 0,e)},this.onClear=()=>{this.navIndex=re,this.props.onClear&&this.props.onClear.call(void 0)},this.onUpload=()=>{this.navIndex=re,this.props.onUpload&&this.props.onUpload.call(void 0)},this.onRetry=e=>{this.props.onRetry&&this.props.onRetry.call(void 0,e)},this.onRemove=e=>{this.navIndex=this.navIndex>re?this.navIndex-1:re,this.props.onRemove&&this.props.onRemove.call(void 0,e)},this.onAdd=e=>{this.navIndex=re,this.props.onAdd&&this.props.onAdd.call(void 0,e)},this.onClick=e=>{this.navIndex=e},this.onFocus=()=>{this._blurTimeout&&(clearTimeout(this._blurTimeout),this._blurTimeout=void 0)},this.onBlurTimeout=()=>{this.navIndex=le,this._blurTimeout=void 0},this.onBlur=()=>{clearTimeout(this._blurTimeout),this._blurTimeout=window.setTimeout(this.onBlurTimeout)},this._navIndex=le}get navIndex(){return this._navIndex}set navIndex(e){const t=this.navIndex;this._navIndex=e,e!==t&&this.forceUpdate()}get actionElement(){if(this._uploadUI)return this._uploadUI.actionElement}componentDidUpdate(e){const t=Object.keys(e.groupedFiles).length,s=Object.keys(this.props.groupedFiles).length;t>s&&this.navIndex>re&&(this.navIndex=this.navIndex-(t-s))}render(){const{onClear:e,onRemove:t,onRetry:s,onCancel:o,onUpload:n,onAdd:i,...a}=this.props;return c.createElement(ae,{ref:e=>{this._uploadUI=e},className:this.props.className,onKeyDown:this.onKeyDown,navigationIndex:this.navIndex,notFocusedIndex:le,onAdd:this.onAdd,onClear:this.onClear,onUpload:this.onUpload,onRemove:this.onRemove,onRetry:this.onRetry,onCancel:this.onCancel,onClick:this.onClick,onFocus:this.onFocus,onBlur:this.onBlur,...a})}}const ce=(e,t)=>{t.push(e)},pe=(e,t)=>{Object.keys(e).forEach(s=>{t(e[s],s)})},ue={copyState:e=>(e||[]).map(e=>({...e})),addMany:(e,t)=>{e.forEach(e=>ce(e,t))},add:ce,groupFilesByUid:e=>{const t={};return e.forEach(e=>{t[e.uid]?t[e.uid].push(e):t[e.uid]=[e]}),t},filesForUpload:e=>{const t={};return pe(e,(e,s)=>{let o=!0;e.forEach(e=>{(e.status!==p.Selected||e.validationErrors&&e.validationErrors.length>0)&&(o=!1)}),o&&(t[s]=e)}),t},setFilesStatus:(e,t)=>{pe(e,e=>{e.forEach(e=>{e.status=t})})},flatFileGroup:e=>{const t=[];return pe(e,e=>{t.push.apply(t,e)}),t},groupForEach:pe},he=(e,t)=>{Object.keys(t).forEach(s=>{e.append(s,t[s])})},me=(e,t,s)=>{const o=new FormData;return he(o,s),e.forEach(e=>{const s=e.getRawFile?e.getRawFile():"";s?o.append(t,s,e.name):o.append(t,s)}),o},ge=(e,t,s)=>{const o=new FormData;return he(o,s),e.forEach(e=>{o.append(t,e)}),o},ve=(e,t)=>({headers:e,responseType:t.responseType,withCredentials:t.withCredentials}),fe=e=>{const t={};return Object.keys(e).forEach(s=>{t[s]=e[s]}),t},ye=e=>{const{data:t,config:s,...o}=e;return{response:t,...o}},Ee="invalidMaxFileSize",ke="invalidMinFileSize",Fe="invalidFileExtension",be=(e,t)=>{t.length>0&&t.indexOf((e.extension||"").toLowerCase())<0&&(e.validationErrors=e.validationErrors||[],e.validationErrors.indexOf(Fe)<0&&e.validationErrors.push(Fe))},Ce=(e,t,s)=>{0!==t&&(e.size||0)<t&&(e.validationErrors=e.validationErrors||[],e.validationErrors.indexOf(ke)<0&&e.validationErrors.push(ke)),0!==s&&(e.size||0)>s&&(e.validationErrors=e.validationErrors||[],e.validationErrors.indexOf(Ee)<0&&e.validationErrors.push(Ee))},Ue=(e,t)=>{const s=(e=>e.map(e=>("."===e.substring(0,1)?e:"."+e).toLowerCase()))(t.allowedExtensions||[]),o=t.maxFileSize||0,n=t.minFileSize||0;let i;for(i=0;i<e.length;i++)be(e[i],s),Ce(e[i],n,o)},Ie=Object.freeze({name:"@progress/kendo-react-upload",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate:0,version:"14.1.2-develop.2",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"}),Se=class extends c.Component{constructor(e){super(e),this._httpSubscriptions={},this._uploadNavigation=null,this.showLicenseWatermark=!1,this.focus=()=>{this._uploadNavigation&&this._uploadNavigation.focus()},this.triggerUpload=()=>{this.onUpload()},this.uploadFiles=e=>{const t=this.async;ue.setFilesStatus(e,p.Uploading),ue.groupForEach(e,(e,s)=>{const o={target:this,files:e,headers:fe(t.saveHeaders||{}),additionalData:{}};this.props.onBeforeUpload&&this.props.onBeforeUpload.call(void 0,o);const n=ve(o.headers,this.async),i=me(e,t.saveField,o.additionalData);if(this.isCustomSave)this.props.saveUrl(e,{formData:i,requestOptions:n},this.onUploadProgress).then(e=>this.onUploadSuccess(e.uid)).catch(e=>this.onUploadError(e.uid));else{const e=r.CancelToken.source();this._httpSubscriptions[s]=e,r({method:t.saveMethod,url:t.saveUrl,data:i,cancelToken:e.token,...n,onUploadProgress:e=>this.onUploadProgress(s,e)}).then(e=>this.onUploadSuccess(s,e)).catch(e=>this.onUploadError(s,e))}})},this.removeFiles=e=>{const t=this.async;ue.groupForEach(e,(e,s)=>{const o={target:this,files:e,headers:fe(t.removeHeaders||{}),additionalData:{}};this.props.onBeforeRemove&&this.props.onBeforeRemove.call(void 0,o);const n=e.map(e=>e.name),i=ve(o.headers,this.async),a=ge(n,t.removeField,o.additionalData);this.isCustomRemove?this.props.removeUrl(e,{formData:a,requestOptions:i}).then(e=>this.onRemoveSuccess(e.uid)).catch(e=>this.onRemoveError(e.uid)):r({method:t.removeMethod,url:t.removeUrl,data:a,...i}).then(e=>this.onRemoveSuccess(s,e)).catch(e=>this.onRemoveError(s,e))})},this.onUpload=()=>{const e=this.fileStateCopy,t=ue.groupFilesByUid(e),s=ue.filesForUpload(t);this.uploadFiles(s);const o=()=>{if(this.props.onStatusChange){const t={target:this,newState:e,affectedFiles:ue.flatFileGroup(s)};this.props.onStatusChange.call(void 0,t)}};this.isControlled?o():this.setState({files:e},o)},this.onAdd=e=>{let t,s=$.getAllFileInfo(e);if(s=$.assignGuidToFiles(s,this.async.batch),Ue(s,this.props.restrictions),t=this.props.multiple?this.fileStateCopy:[],ue.addMany(s,t),this.async.autoUpload){const e=ue.groupFilesByUid(t);this.uploadFiles(ue.filesForUpload(e))}const o=()=>{if(this.props.onAdd){const e={target:this,newState:t,affectedFiles:s};this.props.onAdd.call(void 0,e)}};this.isControlled?o():this.setState({files:t},o)},this.onUploadProgress=(e,t)=>{const s=Math.round(100*t.loaded/(t.total||0))||0,o=()=>{if(this.props.onProgress){const t=this.fileStateCopy,o=t.filter(t=>t.uid===e);this.setFilesProgress(t,s);const n={target:this,newState:t,affectedFiles:o};this.props.onProgress.call(void 0,n)}};this.isControlled?o():this.setState(t=>{const o=t.files,n=o.filter(t=>t.uid===e);if(this.setFilesProgress(n,s),n.length)return{files:o}},o)},this.onUploadSuccess=(e,t)=>{const s=this.fileStateCopy,o=s.filter(t=>t.uid===e);o.forEach(e=>{e.status=p.Uploaded,e.progress=100}),delete this._httpSubscriptions[e];const n=()=>{if(this.props.onStatusChange){const e={target:this,newState:s,affectedFiles:o,response:t?ye(t):void 0};this.props.onStatusChange.call(void 0,e)}};this.isControlled?n():this.setState({files:s},n)},this.onUploadError=(e,t)=>{const s=this.fileStateCopy,o=s.filter(t=>t.uid===e);if(o.forEach(e=>{e.status=p.UploadFailed}),delete this._httpSubscriptions[e],!o.length)return;const n=()=>{if(this.props.onStatusChange){const e={target:this,newState:s,affectedFiles:o,response:t?ye(t):void 0};this.props.onStatusChange.call(void 0,e)}};this.isControlled?n():this.setState({files:s},n)},this.onRemove=e=>{const t=this.fileStateCopy,s=t.filter(t=>t.uid===e),o=t.filter(t=>t.uid!==e);if([p.Uploaded,p.Initial,p.RemoveFailed].indexOf(s[0].status)>-1){const o={[e]:s};ue.setFilesStatus(o,p.Removing),this.removeFiles(o);const n=()=>{if(this.props.onStatusChange){const e={target:this,newState:t,affectedFiles:s};this.props.onStatusChange.call(void 0,e)}};this.isControlled?n():this.setState({files:t},n)}else{const e=()=>{if(this.props.onRemove){const e={target:this,newState:o,affectedFiles:s};this.props.onRemove.call(void 0,e)}};this.isControlled?e():this.setState({files:o},e)}},this.onRemoveSuccess=(e,t)=>{const s=this.fileStateCopy,o=s.filter(t=>t.uid===e),n=s.filter(t=>t.uid!==e),i=()=>{if(this.props.onRemove){const e={target:this,newState:n,affectedFiles:o,response:t?ye(t):void 0};this.props.onRemove.call(void 0,e)}};this.isControlled?i():this.setState({files:n},i)},this.onRemoveError=(e,t)=>{const s=this.fileStateCopy,o=s.filter(t=>t.uid===e);o.forEach(e=>{e.status=p.RemoveFailed});const n=()=>{if(this.props.onStatusChange){const e={target:this,newState:s,affectedFiles:o,response:t?ye(t):void 0};this.props.onStatusChange.call(void 0,e)}};this.isControlled?n():this.setState({files:s},n)},this.onRetry=e=>{const t=this.fileStateCopy,s=ue.groupFilesByUid(t.filter(t=>t.uid===e));ue.setFilesStatus(s,p.Uploading),this.uploadFiles(s);const o=()=>{if(this.props.onStatusChange){const e={target:this,newState:t,affectedFiles:ue.flatFileGroup(s)};this.props.onStatusChange.call(void 0,e)}};this.isControlled?o():this.setState({files:t},o)},this.onCancel=e=>{const t=this.fileStateCopy,s=t.filter(t=>t.uid!==e),o=t.filter(t=>t.uid===e);if(this._httpSubscriptions[e]&&(this._httpSubscriptions[e].cancel(),delete this._httpSubscriptions[e]),this.props.onCancel){const t={target:this,uid:e};this.props.onCancel.call(void 0,t)}const n=()=>{if(this.props.onRemove){const e={target:this,newState:s,affectedFiles:o};this.props.onRemove.call(void 0,e)}};this.isControlled?n():this.setState({files:s},n)},this.onClear=()=>{if(!this.files.length)return;Object.keys(this._httpSubscriptions).forEach(e=>{this._httpSubscriptions[e].cancel()}),this._httpSubscriptions={};const e=()=>{if(this.props.onRemove){const e={target:this,newState:[],affectedFiles:this.fileStateCopy};this.props.onRemove.call(void 0,e)}};this.isControlled?e():this.setState({files:[]},e)},this.showLicenseWatermark=!s.validatePackage(Ie,{component:"Upload"}),this.licenseMessage=s.getLicenseMessage(Ie),this.state={files:e.defaultFiles||[]}}get async(){const{autoUpload:e,batch:t,removeField:s,removeHeaders:o,removeMethod:n,removeUrl:i,responseType:a,saveField:l,saveHeaders:r,saveMethod:d,saveUrl:c,withCredentials:p}=this.props;return{autoUpload:e,batch:t,removeField:s,removeHeaders:o,removeMethod:n,removeUrl:i,responseType:a,saveField:l,saveHeaders:r,saveMethod:d,saveUrl:c,withCredentials:p}}get files(){return(this.isControlled?this.props.files:this.state.files)||[]}get isControlled(){return!this.props.defaultFiles}get isCustomSave(){return this.props.saveUrl&&"function"==typeof this.props.saveUrl}get isCustomRemove(){return this.props.removeUrl&&"function"==typeof this.props.removeUrl}get fileStateCopy(){return this.isControlled?ue.copyState(this.props.files):ue.copyState(this.state.files)}get actionElement(){if(this._uploadNavigation)return this._uploadNavigation.actionElement}setFilesProgress(e,t){e.forEach(e=>{e.progress=t})}render(){var e;const{showFileList:t,onAdd:o,onRemove:n,onCancel:i,autoUpload:a,showActionButtons:l,actionsLayout:r,tabIndex:d,disabled:p,...u}=this.props,h=ue.groupFilesByUid(this.files),m=ue.filesForUpload(h);return c.createElement(c.Fragment,null,c.createElement(de,{groupedFiles:h,className:this.props.className,showFileList:t&&!!Object.keys(h).length,showActionButtons:l&&!a&&(!!Object.keys(m).length||!(null==(e=this.props.defaultFiles)||!e.length)),actionsLayout:r,autoUpload:a,disabled:p,onAdd:this.onAdd,onRemove:this.onRemove,onClear:this.onClear,onUpload:this.onUpload,onRetry:this.onRetry,onCancel:this.onCancel,tabIndex:s.getTabIndex(d,p),ref:e=>{this._uploadNavigation=e},...u}),this.showLicenseWatermark&&c.createElement(s.WatermarkOverlay,{message:this.licenseMessage}))}};Se.defaultProps={autoUpload:!0,batch:!1,removeField:"fileNames",removeHeaders:{},removeMethod:"POST",removeUrl:"",responseType:"json",saveField:"files",saveHeaders:{},saveMethod:"POST",saveUrl:"",withCredentials:!0,restrictions:{allowedExtensions:[],maxFileSize:0,minFileSize:0},multiple:!0,showFileList:!0,showActionButtons:!0,actionsLayout:"end",disabled:!1},Se.propTypes={autoUpload:l.bool,batch:l.bool,withCredentials:l.bool,saveField:l.string,saveHeaders:l.object,saveMethod:l.string,saveUrl:l.oneOfType([l.string,l.func]),responseType:l.oneOf(["arraybuffer","blob","json","text"]),removeField:l.string,removeHeaders:l.object,removeMethod:l.string,removeUrl:l.oneOfType([l.string,l.func]),multiple:l.bool,disabled:l.bool,showFileList:l.bool,showActionButtons:l.bool,actionsLayout:l.oneOf(["start","center","end","stretched"]),tabIndex:l.number,accept:l.string,listItemUI:l.oneOfType([l.func,l.string,l.shape({render:l.func.isRequired})]),restrictions:l.shape({allowedExtensions:l.arrayOf(l.string),maxFileSize:l.number,minFileSize:l.number}),files:l.arrayOf(l.shape({uid:l.string,name:l.string,extension:l.string,size:l.number,validationErrors:l.arrayOf(l.string),status:l.oneOf([p.Initial,p.RemoveFailed,p.Removing,p.Selected,p.UploadFailed,p.Uploaded,p.Uploading]),progress:l.number,getRawFile:l.func})),defaultFiles:l.arrayOf(l.shape({uid:l.string,name:l.string,extension:l.string,size:l.number,validationErrors:l.arrayOf(l.string),status:l.oneOf([p.Initial,p.RemoveFailed,p.Removing,p.Selected,p.UploadFailed,p.Uploaded,p.Uploading]),progress:l.number,getRawFile:l.func}))};let xe=Se;const De=c.forwardRef((e,t)=>{const o=!s.validatePackage(Ie,{component:"ExternalDropZone"}),i=s.getLicenseMessage(Ie),l=c.useRef(null),r=c.useRef(null),d=c.useRef(null),p=c.useRef(!1),u=c.useRef(null),{uploadRef:h}=e,m=h.current,[g,v]=c.useState(!1),f=c.useMemo(()=>new n.IntlService("en"),[]),y=n.useLocalization(),E=y.toLanguageString(_,A[_]),[k,F]=c.useState(y.toLanguageString(N,A[N])),b=e.customHint||c.createElement("span",null,E),C=e.customNote||c.createElement("span",null,k),U=c.useCallback(()=>{r.current&&r.current.focus()},[r]);c.useImperativeHandle(l,()=>({element:r.current,focus:U,props:e})),c.useImperativeHandle(t,()=>l.current),c.useEffect(()=>{if(m){const e=m.props.restrictions.allowedExtensions;if(e&&e.length){const t=f.format(y.toLanguageString(B,A[B]),[e]);F(t)}}},[m,y,f]);const I=c.useCallback(e=>(new Date).getTime()-(e||new Date).getTime()>100,[]),S=c.useCallback(t=>{t.preventDefault();const s=t.dataTransfer.files;s.length>0&&!e.disabled&&h&&h.current&&(h.current.onAdd&&(t.preventDefault(),h.current.onAdd(s)),e.onDrop&&e.onDrop.call(void 0,t))},[e.disabled,h,e.onDrop]),x=c.useCallback(t=>{if(p){p.current=!0;const e=()=>{I(u.current)&&(v(!1),p.current=!1,clearInterval(d.current),d.current=null,u.current=null)};d.current=setInterval(e,100)}e.onElementDragEnter&&e.onElementDragEnter.call(void 0,t)},[p,d,u,I,e.onElementDragEnter]),D=c.useCallback(t=>{t.preventDefault(),u.current=new Date,v(!0),e.onElementDragOver&&e.onElementDragOver.call(void 0,t)},[u,e.onElementDragOver]);return c.createElement("div",{ref:r,id:e.id,className:s.classNames("k-external-dropzone",{"k-external-dropzone-hover":g,"k-disabled":e.disabled},e.className),tabIndex:s.getTabIndex(e.tabIndex,e.disabled,void 0),onDrop:S,onDragEnter:x,onDragOver:D},c.createElement("div",{style:e.style,className:"k-dropzone-inner"},c.createElement(s.IconWrap,{name:"upload",icon:a.uploadIcon,className:"k-dropzone-icon",size:"xxxlarge"}),c.createElement("span",{className:"k-dropzone-hint"},b),c.createElement("span",{className:"k-dropzone-note"},C)),o&&c.createElement(s.WatermarkOverlay,{message:i}))}),Re={id:l.string,tabIndex:l.number,editorRef:l.oneOfType([l.func,l.shape({current:l.any})]),disabled:l.bool,onDrop:l.func,onElementDragEnter:l.func,onElementDragOver:l.func};De.displayName="KendoReactExternalDropZone",De.propTypes=Re,e.ExternalDropZone=De,e.Upload=xe,e.UploadActionButtons=te,e.UploadAddButton=ee,e.UploadDropZone=oe,e.UploadFileStatus=p,e.UploadInput=X,e.UploadList=Z,e.UploadListActionButton=q,e.UploadListGroup=W,e.UploadListMultiItem=V,e.UploadListSingleItem=G,e.UploadStatus=se,e.UploadUI=ae,e.headerStatusUploaded=g,e.headerStatusUploading=v,e.invalidMaxFileSize=E,e.uploadMessages=A,e.uploadSelect=C,e.uploadUtils=$});

package/package-metadata.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=Object.freeze({name:"@progress/kendo-react-upload",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate: 1771266933,version:"14.1.1",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"});exports.packageMetadata=e;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=Object.freeze({name:"@progress/kendo-react-upload",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate: 1771345680,version:"14.1.2-develop.2",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"});exports.packageMetadata=e;

package/package-metadata.mjs

@@ -8,6 +8,6 @@ export const packageMetadata = Object.freeze({
     productCode: 'KENDOUIREACT',
     productCodes: ['KENDOUIREACT'],
     publishDate: 0,
-    version: '14.1.1',
+    version: '14.1.2-develop.2',
     licensingDocsUrl: 'https://www.telerik.com/kendo-react-ui/components/my-license/'
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-react-upload",
-  "version": "14.1.1",
+  "version": "14.1.2-develop.2",
   "description": "React Upload component helps users transfer files from their file systems to dedicated server handlers. KendoReact Upload package",
   "author": "Progress",
   "license": "SEE LICENSE IN LICENSE.md",
@@ -26,10 +26,10 @@
   "sideEffects": false,
   "peerDependencies": {
     "@progress/kendo-licensing": "^1.7.2",
-    "@progress/kendo-react-buttons": "14.1.1",
-    "@progress/kendo-react-common": "14.1.1",
-    "@progress/kendo-react-intl": "14.1.1",
-    "@progress/kendo-react-progressbars": "14.1.1",
+    "@progress/kendo-react-buttons": "14.1.2-develop.2",
+    "@progress/kendo-react-common": "14.1.2-develop.2",
+    "@progress/kendo-react-intl": "14.1.2-develop.2",
+    "@progress/kendo-react-progressbars": "14.1.2-develop.2",
     "@progress/kendo-svg-icons": "^4.0.0",
     "axios": "^1.13.2",
     "react": "^18.0.0 || ^19.0.0",
@@ -56,7 +56,7 @@
     "package": {
       "productName": "KendoReact",
       "productCode": "KENDOUIREACT",
-      "publishDate": 1771266933,
+      "publishDate": 1771345680,
       "licensingDocsUrl": "https://www.telerik.com/kendo-react-ui/components/my-license/"
     }
   },

package/utils/connectionUtils.d.ts

@@ -10,6 +10,9 @@ import { UploadAsyncProps } from '../interfaces/UploadAsyncProps.js';
 import { UploadHttpHeaders } from '../interfaces/UploadHttpHeaders.js';
 import { AxiosResponse } from 'axios';
 import { UploadResponse } from '../interfaces/UploadResponse.js';
+/**
+ * @hidden
+ */
 declare const _default: {
     populateClientFormData: (data: FormData, clientData: any) => void;
     populateUploadFormData: (files: UploadFileInfo[], saveField: string, clientData: Object) => FormData;

package/utils/stateUtils.d.ts

@@ -8,6 +8,9 @@
 import { UploadFileInfo } from '../interfaces/UploadFileInfo.js';
 import { UploadFileStatus } from '../interfaces/UploadFileStatus.js';
 import { GroupedFiles } from '../interfaces/FileGroup.js';
+/**
+ * @hidden
+ */
 declare const _default: {
     copyState: (state: UploadFileInfo[] | undefined) => {
         uid: string;

package/utils/utils.d.ts

@@ -7,6 +7,9 @@
  */
 import { UploadFileInfo } from '../interfaces/UploadFileInfo.js';
 import { GroupedFiles } from '../interfaces/FileGroup.js';
+/**
+ * @hidden
+ */
 declare const _default: {
     fileHasValidationErrors: Function;
     filesHaveValidationErrors: Function;

package/utils/validationUtils.d.ts

@@ -5,6 +5,9 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
+/**
+ * @hidden
+ */
 declare const _default: {
     validateFiles: Function;
 };