@progress/kendo-vue-upload 8.4.0-develop.1 → 8.4.0-develop.3

package/Upload.d.ts

@@ -8,7 +8,7 @@
 import { GroupedFiles } from './interfaces/FileGroup';
 import { UploadFileInfo } from './interfaces/UploadFileInfo';
 import { UploadFileStatus } from './interfaces/UploadFileStatus';
-import { AxiosResponse, AxiosProgressEvent } from 'axios';
+import { XHRResponseData } from './utils/connectionUtils';
 import { PropType } from 'vue';
 /**
  * @hidden
@@ -150,12 +150,12 @@ declare const Upload: import('vue').DefineComponent<import('vue').ExtractPropTyp
     removeFiles(filesForRemove: GroupedFiles): void;
     onUpload(): void;
     onAdd(files: FileList): void;
-    onUploadProgress(uid: string, event: ProgressEvent | AxiosProgressEvent): void;
-    onUploadSuccess(uid: string, event?: AxiosResponse): void;
-    onUploadError(uid: string, event?: AxiosResponse): void;
+    onUploadProgress(uid: string, event: ProgressEvent): void;
+    onUploadSuccess(uid: string, event?: XHRResponseData): void;
+    onUploadError(uid: string, event?: XHRResponseData): void;
     onRemove(uid: string): void;
-    onRemoveSuccess(uid: string, event?: AxiosResponse): void;
-    onRemoveError(uid: string, event?: AxiosResponse): void;
+    onRemoveSuccess(uid: string, event?: XHRResponseData): void;
+    onRemoveError(uid: string, event?: XHRResponseData): void;
     onRetry(uid: string): void;
     onCancel(uid: string): void;
     onClear(): void;

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 g=require("vue"),f=require("@progress/kendo-vue-common"),p=require("./interfaces/UploadFileStatus.js"),w=require("./UploadNavigation.js"),v=require("axios"),S=require("./utils/utils.js"),r=require("./utils/stateUtils.js"),d=require("./utils/connectionUtils.js"),A=require("./utils/validationUtils.js"),q=require("./package-metadata.js"),N=g.defineComponent({name:"KendoVueUpload",props:{autoUpload:{type:Boolean,default:!0},batch:{type:Boolean,default:!1},withCredentials:{type:Boolean,default:!0},saveField:{type:String,default:function(){return"files"}},saveHeaders:{type:[String,Function,Object],default:function(){return{}}},saveMethod:{type:String,default:function(){return"POST"}},saveUrl:{type:[String,Function],default:function(){return""}},responseType:{type:String,default:function(){return"json"}},removeField:{type:String,default:function(){return"fileNames"}},removeHeaders:{type:[String,Function,Object],default:function(){return{}}},removeMethod:{type:String,default:function(){return"POST"}},removeUrl:{type:[String,Function],default:function(){return""}},multiple:{type:Boolean,default:!0},disabled:{type:Boolean,default:!1},showFileList:{type:Boolean,default:!0},showActionButtons:{type:Boolean,default:!0},actionsLayout:{type:String,default:function(){return"end"}},tabIndex:Number,accept:String,list:[String,Function,Object],restrictions:{type:Object,default:function(){return{allowedExtensions:[],maxFileSize:0,minFileSize:0}}},validateFile:Function,files:Array,defaultFiles:Array},emits:{add:null,beforeremove:null,beforeupload:null,cancel:null,statuschange:null,progress:null,remove:null},created(){this._httpSubscriptions={},f.validatePackage(q.packageMetadata),this.$props.defaultFiles&&(this.currentFiles=this.$props.defaultFiles)},data(){return{currentFiles:[]}},computed:{computedAsync(){const{autoUpload:s,batch:e,removeField:t,removeHeaders:i,removeMethod:n,removeUrl:o,responseType:a,saveField:u,saveHeaders:h,saveMethod:c,saveUrl:l,withCredentials:F}=this.$props;return{autoUpload:s,batch:e,removeField:t,removeHeaders:i,removeMethod:n,removeUrl:o,responseType:a,saveField:u,saveHeaders:h,saveMethod:c,saveUrl:l,withCredentials:F}},computedFiles(){return(this.isControlled?this.$props.files:this.currentFiles)||[]},isControlled(){return!this.$props.defaultFiles},isCustomSave(){return this.$props.saveUrl&&typeof this.$props.saveUrl=="function"},isCustomRemove(){return this.$props.removeUrl&&typeof this.$props.removeUrl=="function"},fileStateCopy(){return r.copyState(this.computedFiles)},actionElement(){if(this._uploadNavigation)return this._uploadNavigation.actionElement}},mounted(){this._uploadNavigation=this.uploadNavigationRef},methods:{focus(){this._uploadNavigation&&this._uploadNavigation.focus()},uploadFiles(s){const e=this.computedAsync;r.setFilesStatus(s,p.UploadFileStatus.Uploading),r.groupForEach(s,(t,i)=>{const n=d.cloneRequestHeaders(e.saveHeaders||{}),a={target:this,files:t,headers:n,additionalData:{}};this.$emit("beforeupload",a);const u=d.populateRequestOptions(a.headers,this.computedAsync),h=d.populateUploadFormData(t,e.saveField,a.additionalData);if(this.isCustomSave)this.$props.saveUrl(t,{formData:h,requestOptions:u},this.onUploadProgress).then(c=>this.onUploadSuccess(c.uid)).catch(c=>this.onUploadError(c.uid));else{const c=v.CancelToken.source();this._httpSubscriptions[i]=c,v({method:e.saveMethod,url:e.saveUrl,data:h,cancelToken:c.token,...u,onUploadProgress:l=>this.onUploadProgress(i,l)}).then(l=>this.onUploadSuccess(i,l)).catch(l=>this.onUploadError(i,l))}})},removeFiles(s){const e=this.computedAsync;r.groupForEach(s,(t,i)=>{const n=d.cloneRequestHeaders(e.removeHeaders||{}),a={target:this,files:t,headers:n,additionalData:{}};this.$emit("beforeremove",a);const u=t.map(l=>l.name),h=d.populateRequestOptions(a.headers,this.computedAsync),c=d.populateRemoveFormData(u,e.removeField,a.additionalData);this.isCustomRemove?this.$props.removeUrl(t,{formData:c,requestOptions:h}).then(l=>this.onRemoveSuccess(l.uid)).catch(l=>this.onRemoveError(l.uid)):v({method:e.removeMethod,url:e.removeUrl,data:c,...h}).then(l=>this.onRemoveSuccess(i,l)).catch(l=>this.onRemoveError(i,l))})},onUpload(){const s=this.fileStateCopy,e=r.groupFilesByUid(s),t=r.filesForUpload(e);this.uploadFiles(t);const i=()=>{const n={target:this,newState:s,affectedFiles:r.flatFileGroup(t)};this.$emit("statuschange",n)};this.isControlled||(this.currentFiles=s),i()},onAdd(s){let e=S.getAllFileInfo(s),t;if(e=S.assignGuidToFiles(e,this.computedAsync.batch),A.validateFiles(e,this.$props.restrictions,this.validateFile),this.$props.multiple?t=this.fileStateCopy:t=[],r.addMany(e,t),this.computedAsync.autoUpload){const n=r.groupFilesByUid(t);this.uploadFiles(r.filesForUpload(n))}const i=()=>{const n={target:this,newState:t,affectedFiles:e};this.$emit("add",n)};this.isControlled||(this.currentFiles=t),i()},onUploadProgress(s,e){const t=e.total?Math.round(100*e.loaded/e.total):0,i=this.fileStateCopy,n=i.filter(a=>a.uid===s);if(!n.length)return;n.forEach(a=>{a.progress=t});const o=()=>{const a={target:this,newState:i,affectedFiles:n};this.$emit("progress",a)};this.isControlled||(this.currentFiles=i),o()},onUploadSuccess(s,e){const t=this.fileStateCopy,i=t.filter(o=>o.uid===s);i.forEach(o=>{o.status=p.UploadFileStatus.Uploaded}),delete this._httpSubscriptions[s];const n=()=>{const o={target:this,newState:t,affectedFiles:i,response:e?d.convertAxiosResponse(e):void 0};this.$emit("statuschange",o)};this.isControlled||(this.currentFiles=t),n()},onUploadError(s,e){const t=this.fileStateCopy,i=t.filter(o=>o.uid===s);if(i.forEach(o=>{o.status=p.UploadFileStatus.UploadFailed}),delete this._httpSubscriptions[s],!i.length)return;const n=()=>{const o={target:this,newState:t,affectedFiles:i,response:e?d.convertAxiosResponse(e):void 0};this.$emit("statuschange",o)};this.isControlled||(this.currentFiles=t),n()},onRemove(s){const e=this.fileStateCopy,t=e.filter(o=>o.uid===s),i=e.filter(o=>o.uid!==s),n=[p.UploadFileStatus.Uploaded,p.UploadFileStatus.Initial,p.UploadFileStatus.RemoveFailed];if(t[0]&&n.indexOf(t[0].status)>-1){const o={[s]:t};r.setFilesStatus(o,p.UploadFileStatus.Removing),this.removeFiles(o);const a=()=>{const u={target:this,newState:e,affectedFiles:t};this.$emit("statuschange",u)};this.isControlled||(this.currentFiles=e),a()}else{const o=()=>{const a={target:this,newState:i,affectedFiles:t};this.$emit("remove",a)};this.isControlled||(this.currentFiles=i),o()}},onRemoveSuccess(s,e){const t=this.fileStateCopy,i=t.filter(a=>a.uid===s),n=t.filter(a=>a.uid!==s),o=()=>{const a={target:this,newState:n,affectedFiles:i,response:e?d.convertAxiosResponse(e):void 0};this.$emit("remove",a)};this.isControlled||(this.currentFiles=n),o()},onRemoveError(s,e){const t=this.fileStateCopy,i=t.filter(o=>o.uid===s);i.forEach(o=>{o.status=p.UploadFileStatus.RemoveFailed});const n=()=>{const o={target:this,newState:t,affectedFiles:i,response:e?d.convertAxiosResponse(e):void 0};this.$emit("statuschange",o)};this.isControlled||(this.currentFiles=t),n()},onRetry(s){const e=this.fileStateCopy,t=r.groupFilesByUid(e.filter(n=>n.uid===s));r.setFilesStatus(t,p.UploadFileStatus.Uploading),this.uploadFiles(t);const i=()=>{const n={target:this,newState:e,affectedFiles:r.flatFileGroup(t)};this.$emit("statuschange",n)};this.isControlled||(this.currentFiles=e),i()},onCancel(s){const e=this.fileStateCopy,t=e.filter(a=>a.uid!==s),i=e.filter(a=>a.uid===s);this._httpSubscriptions[s]&&(this._httpSubscriptions[s].cancel(),delete this._httpSubscriptions[s]);const n={target:this,uid:s};this.$emit("cancel",n);const o=()=>{const a={target:this,newState:t,affectedFiles:i};this.$emit("remove",a)};this.isControlled||(this.currentFiles=e),o()},onClear(){if(!this.computedFiles.length)return;Object.keys(this._httpSubscriptions).forEach(e=>{this._httpSubscriptions[e].cancel()}),this._httpSubscriptions={};const s=()=>{const e={target:this,newState:[],affectedFiles:this.fileStateCopy};this.$emit("remove",e)};this.isControlled||(this.currentFiles=[]),s()}},render(){const{showFileList:s,autoUpload:e,showActionButtons:t,actionsLayout:i,tabIndex:n,disabled:o,batch:a,withCredentials:u,saveField:h,saveHeaders:c,saveMethod:l,saveUrl:F,responseType:O,removeField:_,removeHeaders:B,removeMethod:T,removeUrl:M,multiple:y,accept:U,restrictions:C,files:R,defaultFiles:b}=this.$props,$=f.templateRendering.call(this,this.$props.list,f.getListeners.call(this)),m=r.groupFilesByUid(this.computedFiles),E=r.filesForUpload(m);return g.createVNode(w.UploadNavigation,{groupedFiles:m,className:this.$props.className,showFileList:s&&!!Object.keys(m).length,showActionButtons:t&&!e&&!!Object.keys(E).length,actionsLayout:i,disabled:o,onAdd:this.onAdd,onRemove:this.onRemove,onClear:this.onClear,onUpload:this.onUpload,onRetry:this.onRetry,onCancel:this.onCancel,tabIndex:f.getTabIndex(n,o),ref:D=>{this.uploadNavigationRef=D},multiple:y,accept:U,list:$,restrictions:C,files:R,defaultFiles:b,async:this.computedAsync},null)}});exports.Upload=N;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const S=require("vue"),v=require("@progress/kendo-vue-common"),h=require("./interfaces/UploadFileStatus.js"),q=require("./UploadNavigation.js"),y=require("./utils/utils.js"),u=require("./utils/stateUtils.js"),p=require("./utils/connectionUtils.js"),D=require("./utils/validationUtils.js"),x=require("./package-metadata.js"),A=S.defineComponent({name:"KendoVueUpload",props:{autoUpload:{type:Boolean,default:!0},batch:{type:Boolean,default:!1},withCredentials:{type:Boolean,default:!0},saveField:{type:String,default:function(){return"files"}},saveHeaders:{type:[String,Function,Object],default:function(){return{}}},saveMethod:{type:String,default:function(){return"POST"}},saveUrl:{type:[String,Function],default:function(){return""}},responseType:{type:String,default:function(){return"json"}},removeField:{type:String,default:function(){return"fileNames"}},removeHeaders:{type:[String,Function,Object],default:function(){return{}}},removeMethod:{type:String,default:function(){return"POST"}},removeUrl:{type:[String,Function],default:function(){return""}},multiple:{type:Boolean,default:!0},disabled:{type:Boolean,default:!1},showFileList:{type:Boolean,default:!0},showActionButtons:{type:Boolean,default:!0},actionsLayout:{type:String,default:function(){return"end"}},tabIndex:Number,accept:String,list:[String,Function,Object],restrictions:{type:Object,default:function(){return{allowedExtensions:[],maxFileSize:0,minFileSize:0}}},validateFile:Function,files:Array,defaultFiles:Array},emits:{add:null,beforeremove:null,beforeupload:null,cancel:null,statuschange:null,progress:null,remove:null},created(){this._httpSubscriptions={},v.validatePackage(x.packageMetadata),this.$props.defaultFiles&&(this.currentFiles=this.$props.defaultFiles)},data(){return{currentFiles:[]}},computed:{computedAsync(){const{autoUpload:s,batch:e,removeField:t,removeHeaders:i,removeMethod:n,removeUrl:o,responseType:l,saveField:c,saveHeaders:d,saveMethod:f,saveUrl:a,withCredentials:r}=this.$props;return{autoUpload:s,batch:e,removeField:t,removeHeaders:i,removeMethod:n,removeUrl:o,responseType:l,saveField:c,saveHeaders:d,saveMethod:f,saveUrl:a,withCredentials:r}},computedFiles(){return(this.isControlled?this.$props.files:this.currentFiles)||[]},isControlled(){return!this.$props.defaultFiles},isCustomSave(){return this.$props.saveUrl&&typeof this.$props.saveUrl=="function"},isCustomRemove(){return this.$props.removeUrl&&typeof this.$props.removeUrl=="function"},fileStateCopy(){return u.copyState(this.computedFiles)},actionElement(){if(this._uploadNavigation)return this._uploadNavigation.actionElement}},mounted(){this._uploadNavigation=this.uploadNavigationRef},methods:{focus(){this._uploadNavigation&&this._uploadNavigation.focus()},uploadFiles(s){const e=this.computedAsync;u.setFilesStatus(s,h.UploadFileStatus.Uploading),u.groupForEach(s,(t,i)=>{var f;const n=p.cloneRequestHeaders(e.saveHeaders||{}),l={target:this,files:t,headers:n,additionalData:{}};this.$emit("beforeupload",l);const c=p.populateRequestOptions(l.headers,this.computedAsync),d=p.populateUploadFormData(t,e.saveField,l.additionalData);if(this.isCustomSave)this.$props.saveUrl(t,{formData:d,requestOptions:c},this.onUploadProgress).then(a=>this.onUploadSuccess(a.uid)).catch(a=>this.onUploadError(a.uid));else{const a=new XMLHttpRequest;this._httpSubscriptions[i]=()=>a.abort(),a.open(e.saveMethod,e.saveUrl,!0),a.withCredentials=(f=c.withCredentials)!=null?f:!0,a.responseType=c.responseType||"json",Object.entries(c.headers||{}).forEach(([r,m])=>{a.setRequestHeader(r,m)}),a.upload.onprogress=r=>this.onUploadProgress(i,r),a.onload=()=>{a.status>=200&&a.status<300?this.onUploadSuccess(i,{response:a.response,status:a.status,statusText:a.statusText,request:a}):this.onUploadError(i,{response:a.response,status:a.status,statusText:a.statusText,request:a})},a.onerror=()=>this.onUploadError(i,{response:a.response,status:a.status,statusText:a.statusText,request:a}),a.onabort=()=>{},a.send(d)}})},removeFiles(s){const e=this.computedAsync;u.groupForEach(s,(t,i)=>{var a;const n=p.cloneRequestHeaders(e.removeHeaders||{}),l={target:this,files:t,headers:n,additionalData:{}};this.$emit("beforeremove",l);const c=t.map(r=>r.name),d=p.populateRequestOptions(l.headers,this.computedAsync),f=p.populateRemoveFormData(c,e.removeField,l.additionalData);if(this.isCustomRemove)this.$props.removeUrl(t,{formData:f,requestOptions:d}).then(r=>this.onRemoveSuccess(r.uid)).catch(r=>this.onRemoveError(r.uid));else{const r=new XMLHttpRequest;r.open(e.removeMethod,e.removeUrl,!0),r.withCredentials=(a=d.withCredentials)!=null?a:!0,r.responseType=d.responseType||"json",Object.entries(d.headers||{}).forEach(([m,g])=>{r.setRequestHeader(m,g)}),r.onload=()=>{r.status>=200&&r.status<300?this.onRemoveSuccess(i,{response:r.response,status:r.status,statusText:r.statusText,request:r}):this.onRemoveError(i,{response:r.response,status:r.status,statusText:r.statusText,request:r})},r.onerror=()=>this.onRemoveError(i,{response:r.response,status:r.status,statusText:r.statusText,request:r}),r.send(f)}})},onUpload(){const s=this.fileStateCopy,e=u.groupFilesByUid(s),t=u.filesForUpload(e);this.uploadFiles(t);const i=()=>{const n={target:this,newState:s,affectedFiles:u.flatFileGroup(t)};this.$emit("statuschange",n)};this.isControlled||(this.currentFiles=s),i()},onAdd(s){let e=y.getAllFileInfo(s),t;if(e=y.assignGuidToFiles(e,this.computedAsync.batch),D.validateFiles(e,this.$props.restrictions,this.validateFile),this.$props.multiple?t=this.fileStateCopy:t=[],u.addMany(e,t),this.computedAsync.autoUpload){const n=u.groupFilesByUid(t);this.uploadFiles(u.filesForUpload(n))}const i=()=>{const n={target:this,newState:t,affectedFiles:e};this.$emit("add",n)};this.isControlled||(this.currentFiles=t),i()},onUploadProgress(s,e){const t=e.total?Math.round(100*e.loaded/e.total):0,i=this.fileStateCopy,n=i.filter(l=>l.uid===s);if(!n.length)return;n.forEach(l=>{l.progress=t});const o=()=>{const l={target:this,newState:i,affectedFiles:n};this.$emit("progress",l)};this.isControlled||(this.currentFiles=i),o()},onUploadSuccess(s,e){const t=this.fileStateCopy,i=t.filter(o=>o.uid===s);i.forEach(o=>{o.status=h.UploadFileStatus.Uploaded,o.progress=100}),delete this._httpSubscriptions[s];const n=()=>{const o={target:this,newState:t,affectedFiles:i,response:e?p.convertResponse(e):void 0};this.$emit("statuschange",o)};this.isControlled||(this.currentFiles=t),n()},onUploadError(s,e){const t=this.fileStateCopy,i=t.filter(o=>o.uid===s);if(i.forEach(o=>{o.status=h.UploadFileStatus.UploadFailed}),delete this._httpSubscriptions[s],!i.length)return;const n=()=>{const o={target:this,newState:t,affectedFiles:i,response:e?p.convertResponse(e):void 0};this.$emit("statuschange",o)};this.isControlled||(this.currentFiles=t),n()},onRemove(s){const e=this.fileStateCopy,t=e.filter(o=>o.uid===s),i=e.filter(o=>o.uid!==s),n=[h.UploadFileStatus.Uploaded,h.UploadFileStatus.Initial,h.UploadFileStatus.RemoveFailed];if(t[0]&&n.indexOf(t[0].status)>-1){const o={[s]:t};u.setFilesStatus(o,h.UploadFileStatus.Removing),this.removeFiles(o);const l=()=>{const c={target:this,newState:e,affectedFiles:t};this.$emit("statuschange",c)};this.isControlled||(this.currentFiles=e),l()}else{const o=()=>{const l={target:this,newState:i,affectedFiles:t};this.$emit("remove",l)};this.isControlled||(this.currentFiles=i),o()}},onRemoveSuccess(s,e){const t=this.fileStateCopy,i=t.filter(l=>l.uid===s),n=t.filter(l=>l.uid!==s),o=()=>{const l={target:this,newState:n,affectedFiles:i,response:e?p.convertResponse(e):void 0};this.$emit("remove",l)};this.isControlled||(this.currentFiles=n),o()},onRemoveError(s,e){const t=this.fileStateCopy,i=t.filter(o=>o.uid===s);i.forEach(o=>{o.status=h.UploadFileStatus.RemoveFailed});const n=()=>{const o={target:this,newState:t,affectedFiles:i,response:e?p.convertResponse(e):void 0};this.$emit("statuschange",o)};this.isControlled||(this.currentFiles=t),n()},onRetry(s){const e=this.fileStateCopy,t=u.groupFilesByUid(e.filter(n=>n.uid===s));u.setFilesStatus(t,h.UploadFileStatus.Uploading),this.uploadFiles(t);const i=()=>{const n={target:this,newState:e,affectedFiles:u.flatFileGroup(t)};this.$emit("statuschange",n)};this.isControlled||(this.currentFiles=e),i()},onCancel(s){const e=this.fileStateCopy,t=e.filter(l=>l.uid!==s),i=e.filter(l=>l.uid===s);this._httpSubscriptions[s]&&(this._httpSubscriptions[s](),delete this._httpSubscriptions[s]);const n={target:this,uid:s};this.$emit("cancel",n);const o=()=>{const l={target:this,newState:t,affectedFiles:i};this.$emit("remove",l)};this.isControlled||(this.currentFiles=e),o()},onClear(){if(!this.computedFiles.length)return;Object.keys(this._httpSubscriptions).forEach(e=>{this._httpSubscriptions[e]()}),this._httpSubscriptions={};const s=()=>{const e={target:this,newState:[],affectedFiles:this.fileStateCopy};this.$emit("remove",e)};this.isControlled||(this.currentFiles=[]),s()}},render(){const{showFileList:s,autoUpload:e,showActionButtons:t,actionsLayout:i,tabIndex:n,disabled:o,batch:l,withCredentials:c,saveField:d,saveHeaders:f,saveMethod:a,saveUrl:r,responseType:m,removeField:g,removeHeaders:O,removeMethod:M,removeUrl:N,multiple:U,accept:C,restrictions:R,files:b,defaultFiles:E}=this.$props,$=v.templateRendering.call(this,this.$props.list,v.getListeners.call(this)),F=u.groupFilesByUid(this.computedFiles),w=u.filesForUpload(F);return S.createVNode(q.UploadNavigation,{groupedFiles:F,className:this.$props.className,showFileList:s&&!!Object.keys(F).length,showActionButtons:t&&!e&&!!Object.keys(w).length,actionsLayout:i,disabled:o,onAdd:this.onAdd,onRemove:this.onRemove,onClear:this.onClear,onUpload:this.onUpload,onRetry:this.onRetry,onCancel:this.onCancel,tabIndex:v.getTabIndex(n,o),ref:T=>{this.uploadNavigationRef=T},multiple:U,accept:C,list:$,restrictions:R,files:b,defaultFiles:E,async:this.computedAsync},null)}});exports.Upload=A;

package/Upload.mjs

@@ -5,17 +5,16 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-import { defineComponent as E, createVNode as D } from "vue";
-import { templateRendering as w, getListeners as A, getTabIndex as _, validatePackage as B } from "@progress/kendo-vue-common";
-import { UploadFileStatus as u } from "./interfaces/UploadFileStatus.mjs";
-import { UploadNavigation as N } from "./UploadNavigation.mjs";
-import m from "axios";
-import F from "./utils/utils.mjs";
-import r from "./utils/stateUtils.mjs";
+import { defineComponent as w, createVNode as T } from "vue";
+import { templateRendering as D, getListeners as x, getTabIndex as A, validatePackage as q } from "@progress/kendo-vue-common";
+import { UploadFileStatus as h } from "./interfaces/UploadFileStatus.mjs";
+import { UploadNavigation as O } from "./UploadNavigation.mjs";
+import g from "./utils/utils.mjs";
+import u from "./utils/stateUtils.mjs";
 import d from "./utils/connectionUtils.mjs";
-import O from "./utils/validationUtils.mjs";
-import { packageMetadata as x } from "./package-metadata.mjs";
-const Q = /* @__PURE__ */ E({
+import _ from "./utils/validationUtils.mjs";
+import { packageMetadata as B } from "./package-metadata.mjs";
+const X = /* @__PURE__ */ w({
   name: "KendoVueUpload",
   props: {
     autoUpload: {
@@ -133,7 +132,7 @@ const Q = /* @__PURE__ */ E({
     remove: null
   },
   created() {
-    this._httpSubscriptions = {}, B(x), this.$props.defaultFiles && (this.currentFiles = this.$props.defaultFiles);
+    this._httpSubscriptions = {}, q(B), this.$props.defaultFiles && (this.currentFiles = this.$props.defaultFiles);
   },
   data() {
     return {
@@ -149,12 +148,12 @@ const Q = /* @__PURE__ */ E({
         removeHeaders: i,
         removeMethod: n,
         removeUrl: o,
-        responseType: a,
-        saveField: p,
-        saveHeaders: h,
-        saveMethod: c,
-        saveUrl: l,
-        withCredentials: v
+        responseType: l,
+        saveField: c,
+        saveHeaders: p,
+        saveMethod: f,
+        saveUrl: a,
+        withCredentials: r
       } = this.$props;
       return {
         autoUpload: s,
@@ -163,12 +162,12 @@ const Q = /* @__PURE__ */ E({
         removeHeaders: i,
         removeMethod: n,
         removeUrl: o,
-        responseType: a,
-        saveField: p,
-        saveHeaders: h,
-        saveMethod: c,
-        saveUrl: l,
-        withCredentials: v
+        responseType: l,
+        saveField: c,
+        saveHeaders: p,
+        saveMethod: f,
+        saveUrl: a,
+        withCredentials: r
       };
     },
     computedFiles() {
@@ -184,7 +183,7 @@ const Q = /* @__PURE__ */ E({
       return this.$props.removeUrl && typeof this.$props.removeUrl == "function";
     },
     fileStateCopy() {
-      return r.copyState(this.computedFiles);
+      return u.copyState(this.computedFiles);
     },
     actionElement() {
       if (this._uploadNavigation)
@@ -200,73 +199,107 @@ const Q = /* @__PURE__ */ E({
     },
     uploadFiles(s) {
       const e = this.computedAsync;
-      r.setFilesStatus(s, u.Uploading), r.groupForEach(s, (t, i) => {
-        const n = d.cloneRequestHeaders(e.saveHeaders || {}), a = {
+      u.setFilesStatus(s, h.Uploading), u.groupForEach(s, (t, i) => {
+        var f;
+        const n = d.cloneRequestHeaders(e.saveHeaders || {}), l = {
           target: this,
           files: t,
           headers: n,
           additionalData: {}
         };
-        this.$emit("beforeupload", a);
-        const p = d.populateRequestOptions(a.headers, this.computedAsync), h = d.populateUploadFormData(t, e.saveField, a.additionalData);
+        this.$emit("beforeupload", l);
+        const c = d.populateRequestOptions(l.headers, this.computedAsync), p = d.populateUploadFormData(t, e.saveField, l.additionalData);
         if (this.isCustomSave)
           this.$props.saveUrl(t, {
-            formData: h,
-            requestOptions: p
-          }, this.onUploadProgress).then((c) => this.onUploadSuccess(c.uid)).catch((c) => this.onUploadError(c.uid));
+            formData: p,
+            requestOptions: c
+          }, this.onUploadProgress).then((a) => this.onUploadSuccess(a.uid)).catch((a) => this.onUploadError(a.uid));
         else {
-          const c = m.CancelToken.source();
-          this._httpSubscriptions[i] = c, m({
-            method: e.saveMethod,
-            url: e.saveUrl,
-            data: h,
-            cancelToken: c.token,
-            ...p,
-            onUploadProgress: (l) => this.onUploadProgress(i, l)
-          }).then((l) => this.onUploadSuccess(i, l)).catch((l) => this.onUploadError(i, l));
+          const a = new XMLHttpRequest();
+          this._httpSubscriptions[i] = () => a.abort(), a.open(e.saveMethod, e.saveUrl, !0), a.withCredentials = (f = c.withCredentials) != null ? f : !0, a.responseType = c.responseType || "json", Object.entries(c.headers || {}).forEach(([r, m]) => {
+            a.setRequestHeader(r, m);
+          }), a.upload.onprogress = (r) => this.onUploadProgress(i, r), a.onload = () => {
+            a.status >= 200 && a.status < 300 ? this.onUploadSuccess(i, {
+              response: a.response,
+              status: a.status,
+              statusText: a.statusText,
+              request: a
+            }) : this.onUploadError(i, {
+              response: a.response,
+              status: a.status,
+              statusText: a.statusText,
+              request: a
+            });
+          }, a.onerror = () => this.onUploadError(i, {
+            response: a.response,
+            status: a.status,
+            statusText: a.statusText,
+            request: a
+          }), a.onabort = () => {
+          }, a.send(p);
         }
       });
     },
     removeFiles(s) {
       const e = this.computedAsync;
-      r.groupForEach(s, (t, i) => {
-        const n = d.cloneRequestHeaders(e.removeHeaders || {}), a = {
+      u.groupForEach(s, (t, i) => {
+        var a;
+        const n = d.cloneRequestHeaders(e.removeHeaders || {}), l = {
           target: this,
           files: t,
           headers: n,
           additionalData: {}
         };
-        this.$emit("beforeremove", a);
-        const p = t.map((l) => l.name), h = d.populateRequestOptions(a.headers, this.computedAsync), c = d.populateRemoveFormData(p, e.removeField, a.additionalData);
-        this.isCustomRemove ? this.$props.removeUrl(t, {
-          formData: c,
-          requestOptions: h
-        }).then((l) => this.onRemoveSuccess(l.uid)).catch((l) => this.onRemoveError(l.uid)) : m({
-          method: e.removeMethod,
-          url: e.removeUrl,
-          data: c,
-          ...h
-        }).then((l) => this.onRemoveSuccess(i, l)).catch((l) => this.onRemoveError(i, l));
+        this.$emit("beforeremove", l);
+        const c = t.map((r) => r.name), p = d.populateRequestOptions(l.headers, this.computedAsync), f = d.populateRemoveFormData(c, e.removeField, l.additionalData);
+        if (this.isCustomRemove)
+          this.$props.removeUrl(t, {
+            formData: f,
+            requestOptions: p
+          }).then((r) => this.onRemoveSuccess(r.uid)).catch((r) => this.onRemoveError(r.uid));
+        else {
+          const r = new XMLHttpRequest();
+          r.open(e.removeMethod, e.removeUrl, !0), r.withCredentials = (a = p.withCredentials) != null ? a : !0, r.responseType = p.responseType || "json", Object.entries(p.headers || {}).forEach(([m, F]) => {
+            r.setRequestHeader(m, F);
+          }), r.onload = () => {
+            r.status >= 200 && r.status < 300 ? this.onRemoveSuccess(i, {
+              response: r.response,
+              status: r.status,
+              statusText: r.statusText,
+              request: r
+            }) : this.onRemoveError(i, {
+              response: r.response,
+              status: r.status,
+              statusText: r.statusText,
+              request: r
+            });
+          }, r.onerror = () => this.onRemoveError(i, {
+            response: r.response,
+            status: r.status,
+            statusText: r.statusText,
+            request: r
+          }), r.send(f);
+        }
       });
     },
     onUpload() {
-      const s = this.fileStateCopy, e = r.groupFilesByUid(s), t = r.filesForUpload(e);
+      const s = this.fileStateCopy, e = u.groupFilesByUid(s), t = u.filesForUpload(e);
       this.uploadFiles(t);
       const i = () => {
         const n = {
           target: this,
           newState: s,
-          affectedFiles: r.flatFileGroup(t)
+          affectedFiles: u.flatFileGroup(t)
         };
         this.$emit("statuschange", n);
       };
       this.isControlled || (this.currentFiles = s), i();
     },
     onAdd(s) {
-      let e = F.getAllFileInfo(s), t;
-      if (e = F.assignGuidToFiles(e, this.computedAsync.batch), O.validateFiles(e, this.$props.restrictions, this.validateFile), this.$props.multiple ? t = this.fileStateCopy : t = [], r.addMany(e, t), this.computedAsync.autoUpload) {
-        const n = r.groupFilesByUid(t);
-        this.uploadFiles(r.filesForUpload(n));
+      let e = g.getAllFileInfo(s), t;
+      if (e = g.assignGuidToFiles(e, this.computedAsync.batch), _.validateFiles(e, this.$props.restrictions, this.validateFile), this.$props.multiple ? t = this.fileStateCopy : t = [], u.addMany(e, t), this.computedAsync.autoUpload) {
+        const n = u.groupFilesByUid(t);
+        this.uploadFiles(u.filesForUpload(n));
       }
       const i = () => {
         const n = {
@@ -279,33 +312,33 @@ const Q = /* @__PURE__ */ E({
       this.isControlled || (this.currentFiles = t), i();
     },
     onUploadProgress(s, e) {
-      const t = e.total ? Math.round(100 * e.loaded / e.total) : 0, i = this.fileStateCopy, n = i.filter((a) => a.uid === s);
+      const t = e.total ? Math.round(100 * e.loaded / e.total) : 0, i = this.fileStateCopy, n = i.filter((l) => l.uid === s);
       if (!n.length)
         return;
-      n.forEach((a) => {
-        a.progress = t;
+      n.forEach((l) => {
+        l.progress = t;
       });
       const o = () => {
-        const a = {
+        const l = {
           target: this,
           newState: i,
           affectedFiles: n
         };
-        this.$emit("progress", a);
+        this.$emit("progress", l);
       };
       this.isControlled || (this.currentFiles = i), o();
     },
     onUploadSuccess(s, e) {
       const t = this.fileStateCopy, i = t.filter((o) => o.uid === s);
       i.forEach((o) => {
-        o.status = u.Uploaded;
+        o.status = h.Uploaded, o.progress = 100;
       }), delete this._httpSubscriptions[s];
       const n = () => {
         const o = {
           target: this,
           newState: t,
           affectedFiles: i,
-          response: e ? d.convertAxiosResponse(e) : void 0
+          response: e ? d.convertResponse(e) : void 0
         };
         this.$emit("statuschange", o);
       };
@@ -314,7 +347,7 @@ const Q = /* @__PURE__ */ E({
     onUploadError(s, e) {
       const t = this.fileStateCopy, i = t.filter((o) => o.uid === s);
       if (i.forEach((o) => {
-        o.status = u.UploadFailed;
+        o.status = h.UploadFailed;
       }), delete this._httpSubscriptions[s], !i.length)
         return;
       const n = () => {
@@ -322,96 +355,96 @@ const Q = /* @__PURE__ */ E({
           target: this,
           newState: t,
           affectedFiles: i,
-          response: e ? d.convertAxiosResponse(e) : void 0
+          response: e ? d.convertResponse(e) : void 0
         };
         this.$emit("statuschange", o);
       };
       this.isControlled || (this.currentFiles = t), n();
     },
     onRemove(s) {
-      const e = this.fileStateCopy, t = e.filter((o) => o.uid === s), i = e.filter((o) => o.uid !== s), n = [u.Uploaded, u.Initial, u.RemoveFailed];
+      const e = this.fileStateCopy, t = e.filter((o) => o.uid === s), i = e.filter((o) => o.uid !== s), n = [h.Uploaded, h.Initial, h.RemoveFailed];
       if (t[0] && n.indexOf(t[0].status) > -1) {
         const o = {
           [s]: t
         };
-        r.setFilesStatus(o, u.Removing), this.removeFiles(o);
-        const a = () => {
-          const p = {
+        u.setFilesStatus(o, h.Removing), this.removeFiles(o);
+        const l = () => {
+          const c = {
             target: this,
             newState: e,
             affectedFiles: t
           };
-          this.$emit("statuschange", p);
+          this.$emit("statuschange", c);
         };
-        this.isControlled || (this.currentFiles = e), a();
+        this.isControlled || (this.currentFiles = e), l();
       } else {
         const o = () => {
-          const a = {
+          const l = {
             target: this,
             newState: i,
             affectedFiles: t
           };
-          this.$emit("remove", a);
+          this.$emit("remove", l);
         };
         this.isControlled || (this.currentFiles = i), o();
       }
     },
     onRemoveSuccess(s, e) {
-      const t = this.fileStateCopy, i = t.filter((a) => a.uid === s), n = t.filter((a) => a.uid !== s), o = () => {
-        const a = {
+      const t = this.fileStateCopy, i = t.filter((l) => l.uid === s), n = t.filter((l) => l.uid !== s), o = () => {
+        const l = {
           target: this,
           newState: n,
           affectedFiles: i,
-          response: e ? d.convertAxiosResponse(e) : void 0
+          response: e ? d.convertResponse(e) : void 0
         };
-        this.$emit("remove", a);
+        this.$emit("remove", l);
       };
       this.isControlled || (this.currentFiles = n), o();
     },
     onRemoveError(s, e) {
       const t = this.fileStateCopy, i = t.filter((o) => o.uid === s);
       i.forEach((o) => {
-        o.status = u.RemoveFailed;
+        o.status = h.RemoveFailed;
       });
       const n = () => {
         const o = {
           target: this,
           newState: t,
           affectedFiles: i,
-          response: e ? d.convertAxiosResponse(e) : void 0
+          response: e ? d.convertResponse(e) : void 0
         };
         this.$emit("statuschange", o);
       };
       this.isControlled || (this.currentFiles = t), n();
     },
     onRetry(s) {
-      const e = this.fileStateCopy, t = r.groupFilesByUid(e.filter((n) => n.uid === s));
-      r.setFilesStatus(t, u.Uploading), this.uploadFiles(t);
+      const e = this.fileStateCopy, t = u.groupFilesByUid(e.filter((n) => n.uid === s));
+      u.setFilesStatus(t, h.Uploading), this.uploadFiles(t);
       const i = () => {
         const n = {
           target: this,
           newState: e,
-          affectedFiles: r.flatFileGroup(t)
+          affectedFiles: u.flatFileGroup(t)
         };
         this.$emit("statuschange", n);
       };
       this.isControlled || (this.currentFiles = e), i();
     },
     onCancel(s) {
-      const e = this.fileStateCopy, t = e.filter((a) => a.uid !== s), i = e.filter((a) => a.uid === s);
-      this._httpSubscriptions[s] && (this._httpSubscriptions[s].cancel(), delete this._httpSubscriptions[s]);
+      const e = this.fileStateCopy, t = e.filter((l) => l.uid !== s), i = e.filter((l) => l.uid === s);
+      this._httpSubscriptions[s] && (this._httpSubscriptions[s](), delete this._httpSubscriptions[s]);
       const n = {
         target: this,
         uid: s
       };
       this.$emit("cancel", n);
       const o = () => {
-        const a = {
+        const l = {
           target: this,
           newState: t,
           affectedFiles: i
         };
-        this.$emit("remove", a);
+        this.$emit("remove", l);
       };
       this.isControlled || (this.currentFiles = e), o();
     },
@@ -419,7 +452,7 @@ const Q = /* @__PURE__ */ E({
       if (!this.computedFiles.length)
         return;
       Object.keys(this._httpSubscriptions).forEach((e) => {
-        this._httpSubscriptions[e].cancel();
+        this._httpSubscriptions[e]();
       }), this._httpSubscriptions = {};
       const s = () => {
         const e = {
@@ -440,28 +473,28 @@ const Q = /* @__PURE__ */ E({
       actionsLayout: i,
       tabIndex: n,
       disabled: o,
-      batch: a,
-      withCredentials: p,
-      saveField: h,
-      saveHeaders: c,
-      saveMethod: l,
-      saveUrl: v,
-      responseType: T,
-      removeField: M,
+      batch: l,
+      withCredentials: c,
+      saveField: p,
+      saveHeaders: f,
+      saveMethod: a,
+      saveUrl: r,
+      responseType: m,
+      removeField: F,
       removeHeaders: H,
-      removeMethod: k,
-      removeUrl: P,
-      multiple: g,
-      accept: S,
-      restrictions: y,
-      files: U,
-      defaultFiles: C
-    } = this.$props, R = w.call(this, this.$props.list, A.call(this)), f = r.groupFilesByUid(this.computedFiles), b = r.filesForUpload(f);
-    return D(N, {
-      groupedFiles: f,
+      removeMethod: N,
+      removeUrl: M,
+      multiple: S,
+      accept: y,
+      restrictions: U,
+      files: C,
+      defaultFiles: R
+    } = this.$props, b = D.call(this, this.$props.list, x.call(this)), v = u.groupFilesByUid(this.computedFiles), E = u.filesForUpload(v);
+    return T(O, {
+      groupedFiles: v,
       className: this.$props.className,
-      showFileList: s && !!Object.keys(f).length,
-      showActionButtons: t && !e && !!Object.keys(b).length,
+      showFileList: s && !!Object.keys(v).length,
+      showActionButtons: t && !e && !!Object.keys(E).length,
       actionsLayout: i,
       disabled: o,
       onAdd: this.onAdd,
@@ -470,20 +503,20 @@ const Q = /* @__PURE__ */ E({
       onUpload: this.onUpload,
       onRetry: this.onRetry,
       onCancel: this.onCancel,
-      tabIndex: _(n, o),
+      tabIndex: A(n, o),
       ref: ($) => {
         this.uploadNavigationRef = $;
       },
-      multiple: g,
-      accept: S,
-      list: R,
-      restrictions: y,
-      files: U,
-      defaultFiles: C,
+      multiple: S,
+      accept: y,
+      list: b,
+      restrictions: U,
+      files: C,
+      defaultFiles: R,
       async: this.computedAsync
     }, null);
   }
 });
 export {
-  Q as Upload
+  X as Upload
 };

package/UploadAddButton.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 t=require("vue"),d=require("@progress/kendo-vue-common"),f=require("@progress/kendo-vue-intl"),o=require("./messages/main.js"),g=require("./UploadInput.js"),v=require("@progress/kendo-vue-buttons");function x(e){return typeof e=="function"||Object.prototype.toString.call(e)==="[object Object]"&&!t.isVNode(e)}const S=t.defineComponent({name:"KendoVueUploadAddButton",props:{addButtonIndex:Number,navigationIndex:Number,notFocusedIndex:Number,tabIndex:Number,async:Object,multiple:Boolean,disabled:Boolean,accept:String,id:String,ariaLabelledBy:String,ariaDescribedBy:String},inject:{kendoLocalizationService:{default:null}},emits:{add:null,click:null},setup(){const e=t.ref(null),n=t.ref(null),i=t.inject("kendoLocalizationService",{});return{elementRef:e,uploadInputRef:n,kendoLocalizationService:i}},created(){this.uploadInputId=d.guid()},mounted(){this.element=this.elementRef,this.uploadInput=this.uploadInputRef},watch:{navigationIndex:function(e,n){this._prevNavigationIndex=n}},updated(){const{navigationIndex:e,addButtonIndex:n,notFocusedIndex:i}=this.$props;e!==this._prevNavigationIndex&&this._prevNavigationIndex!==i&&e===n&&this.element&&this.element.focus()},methods:{focus(){this.element&&this.element.focus()},onClick(){this.actionElement()&&this.actionElement().click(),this.$emit("click",this.$props.addButtonIndex)},onAdd(e){this.$emit("add",e)},onInputMouseDown(e){this.element&&(e.preventDefault(),this.element.focus())},actionElement(){if(this.uploadInput)return this.uploadInput.actionElement()}},render(){const{navigationIndex:e,addButtonIndex:n,tabIndex:i,id:c,async:r,multiple:s,disabled:l,accept:p,ariaLabelledBy:m,ariaDescribedBy:h}=this.$props,u=f.provideLocalizationService(this),a=s?u.toLanguageString(o.select,o.messages[o.select]):u.toLanguageString(o.selectSingle,o.messages[o.selectSingle]),I=d.classNames("k-upload-button",e===n?"k-focus":"");return t.createVNode("div",{class:"k-upload-button-wrap"},[t.createVNode(v.Button,{id:c,ref:d.setRef(this,"element"),role:"button",type:"button",disabled:l,ariaLabel:a,class:I,tabIndex:i,"aria-labelledby":m,"aria-describedby":h,onClick:this.onClick},x(a)?a:{default:()=>[a]}),t.createVNode(g.UploadInput,{id:this.uploadInputId,async:r,multiple:s,disabled:l,accept:p,onMousedown:this.onInputMouseDown,onAdd:this.onAdd,ref:b=>{this.uploadInputRef=b}},null)])}});exports.UploadAddButton=S;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("vue"),d=require("@progress/kendo-vue-common"),f=require("@progress/kendo-vue-intl"),o=require("./messages/main.js"),g=require("./UploadInput.js"),v=require("@progress/kendo-vue-buttons");function x(e){return typeof e=="function"||Object.prototype.toString.call(e)==="[object Object]"&&!t.isVNode(e)}const S=t.defineComponent({name:"KendoVueUploadAddButton",props:{addButtonIndex:Number,navigationIndex:Number,notFocusedIndex:Number,tabIndex:Number,async:Object,multiple:Boolean,disabled:Boolean,accept:String,id:String,ariaLabelledBy:String,ariaDescribedBy:String},inject:{kendoLocalizationService:{default:null}},emits:{add:null,click:null},setup(){const e=t.ref(null),n=t.ref(null),i=t.inject("kendoLocalizationService",{});return{elementRef:e,uploadInputRef:n,kendoLocalizationService:i}},created(){this.uploadInputId=d.guid()},mounted(){this.element=this.elementRef,this.uploadInput=this.uploadInputRef},watch:{navigationIndex:function(e,n){this._prevNavigationIndex=n}},updated(){const{navigationIndex:e,addButtonIndex:n,notFocusedIndex:i}=this.$props;e!==this._prevNavigationIndex&&this._prevNavigationIndex!==i&&e===n&&this.element&&this.element.focus()},methods:{focus(){this.element&&this.element.focus()},onClick(){this.actionElement()&&this.actionElement().click(),this.$emit("click",this.$props.addButtonIndex)},onAdd(e){this.$emit("add",e)},onInputMouseDown(e){this.element&&(e.preventDefault(),this.element.focus())},actionElement(){if(this.uploadInput)return this.uploadInput.actionElement()}},render(){const{navigationIndex:e,addButtonIndex:n,tabIndex:i,id:c,async:r,multiple:s,disabled:l,accept:p,ariaLabelledBy:m,ariaDescribedBy:h}=this.$props,u=f.provideLocalizationService(this),a=s?u.toLanguageString(o.select,o.messages[o.select]):u.toLanguageString(o.selectSingle,o.messages[o.selectSingle]),I=d.classNames("k-upload-button",e===n?"k-focus":"");return t.createVNode("div",{class:"k-upload-button-wrap"},[t.createVNode(v.Button,{id:c,ref:d.setRef(this,"element"),type:"button",disabled:l,class:I,tabIndex:i,"aria-labelledby":m,"aria-describedby":h,onClick:this.onClick},x(a)?a:{default:()=>[a]}),t.createVNode(g.UploadInput,{id:this.uploadInputId,async:r,multiple:s,disabled:l,accept:p,onMousedown:this.onInputMouseDown,onAdd:this.onAdd,ref:b=>{this.uploadInputRef=b}},null)])}});exports.UploadAddButton=S;

package/UploadAddButton.mjs

@@ -101,10 +101,8 @@ const $ = /* @__PURE__ */ v({
     }, [o(j, {
       id: p,
       ref: k(this, "element"),
-      role: "button",
       type: "button",
       disabled: d,
-      ariaLabel: i,
       class: b,
       tabIndex: n,
       "aria-labelledby": h,

package/UploadDropZone.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 t=require("vue"),E=require("@progress/kendo-vue-common"),b=require("./UploadAddButton.js"),O=require("@progress/kendo-vue-intl"),o=require("./messages/main.js"),S=require("./utils/utils.js"),y=require("./UploadStatus.js"),r=100,F=t.defineComponent({name:"KendoVueUploadDropZone",props:{addButtonIndex:Number,async:Object,multiple:{type:Boolean,default:!0},disabled:{type:Boolean,default:!1},showFileList:Boolean,showActionButtons:Boolean,actionsLayout:{type:String,default:function(){return"end"}},tabIndex:Number,accept:String,groupedFiles:{type:Object,default:function(){return{}}},navigationIndex:Number,notFocusedIndex:Number,list:[String,Function,Object],id:String,ariaLabelledBy:String,ariaDescribedBy:String,fileGroup:Object},emits:{add:null,click:null},inject:{kendoLocalizationService:{default:null}},data(){return{currentDocumentActive:!1,currentElementActive:!1}},created(){this.currentElementActive=!1},mounted(){this.uploadAddButton=this.uploadAddButtonRef,document.addEventListener("dragenter",this.onDocumentDragEnter),document.addEventListener("dragover",this.onDocumentDragOver)},unmounted(){document.removeEventListener("dragenter",this.onDocumentDragEnter),document.removeEventListener("dragover",this.onDocumentDragOver)},setup(){const e=t.ref(null),n=t.inject("kendoLocalizationService",{});return{uploadAddButtonRef:e,kendoLocalizationService:n}},computed:{dropZoneClasses(){return{"k-dropzone":!0,"k-upload-dropzone":!0,"k-active":this.currentDocumentActive,"k-hover":this.currentElementActive}}},methods:{actionElement(){if(this.uploadAddButton)return this.uploadAddButton.uploadInput},focus(){if(this.uploadAddButton)return this.uploadAddButton.focus()},onDocumentDragEnter(){if(!this.currentDocumentActive){this.currentDocumentActive=!0;const e=()=>{this.isDragOver(this._lastDocumentDragOver)&&(this.currentDocumentActive=!1,clearInterval(this._documentInterval),this._documentInterval=null,this._lastDocumentDragOver=null)};this._documentInterval=setInterval(e,r)}},onDocumentDragOver(){this._lastDocumentDragOver=new Date},onElementDragEnter(){if(!this.currentElementActive){this.currentElementActive=!0;const e=()=>{this.isDragOver(this._lastElementDragOver)&&(this.currentElementActive=!1,clearInterval(this._elementInterval),this._elementInterval=null,this._lastElementDragOver=null)};this._elementInterval=setInterval(e,r)}},onElementDragOver(e){e.preventDefault(),this._lastElementDragOver=new Date},onDrop(e){e.preventDefault();let n=e.dataTransfer.files;n.length>0&&!this.$props.disabled&&this.$emit("add",n)},isDragOver(e){return new Date().getTime()-(e||new Date).getTime()>r},onClick(e){this.$emit("click",e)},onAdd(e){this.$emit("add",e)}},render(){const{multiple:e,disabled:n,tabIndex:l,fileGroup:u,accept:c,navigationIndex:p,notFocusedIndex:m,id:v,ariaLabelledBy:h,ariaDescribedBy:g}=this.$props,i=O.provideLocalizationService(this),D=e?i.toLanguageString(o.dropFilesHere,o.messages[o.dropFilesHere]):i.toLanguageString(o.dropFileHere,o.messages[o.dropFileHere]),[a,d,s,f]=S.getFileStatus(u),I=E.classNames("k-dropzone-hint",{}),A=function(){return t.createVNode(b.UploadAddButton,{id:v,ariaLabelledBy:h,ariaDescribedBy:g,ref:B=>{this.uploadAddButtonRef=B},accept:c,async:this.async,addButtonIndex:this.addButtonIndex,navigationIndex:p,notFocusedIndex:m,tabIndex:l,multiple:e,disabled:n,onClick:this.onClick,onAdd:this.onAdd},null)};return t.createVNode("div",{class:this.dropZoneClasses,onDrop:this.onDrop,onDragenter:this.onElementDragEnter,onDragover:this.onElementDragOver},[A.call(this),a||d||s||f?t.createVNode(y.UploadStatus,{isUploading:a,isUploaded:d,isUploadFailed:s},null):t.createVNode("div",{class:I},[D])])}});exports.UploadDropZone=F;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("vue"),b=require("@progress/kendo-vue-common"),O=require("./UploadAddButton.js"),S=require("@progress/kendo-vue-intl"),o=require("./messages/main.js"),k=require("./utils/utils.js"),y=require("./UploadStatus.js"),r=100,F=t.defineComponent({name:"KendoVueUploadDropZone",props:{addButtonIndex:Number,async:Object,multiple:{type:Boolean,default:!0},disabled:{type:Boolean,default:!1},showFileList:Boolean,showActionButtons:Boolean,actionsLayout:{type:String,default:function(){return"end"}},tabIndex:Number,accept:String,groupedFiles:{type:Object,default:function(){return{}}},navigationIndex:Number,notFocusedIndex:Number,list:[String,Function,Object],id:String,ariaLabelledBy:String,ariaDescribedBy:String,fileGroup:Object},emits:{add:null,click:null},inject:{kendoLocalizationService:{default:null}},data(){return{currentDocumentActive:!1,currentElementActive:!1}},created(){this.currentElementActive=!1},mounted(){this.uploadAddButton=this.uploadAddButtonRef,document.addEventListener("dragenter",this.onDocumentDragEnter),document.addEventListener("dragover",this.onDocumentDragOver)},unmounted(){document.removeEventListener("dragenter",this.onDocumentDragEnter),document.removeEventListener("dragover",this.onDocumentDragOver)},setup(){const e=t.ref(null),n=t.inject("kendoLocalizationService",{});return{uploadAddButtonRef:e,kendoLocalizationService:n}},computed:{dropZoneClasses(){return{"k-dropzone":!0,"k-upload-dropzone":!0,"k-active":this.currentDocumentActive,"k-hover":this.currentElementActive}}},methods:{actionElement(){if(this.uploadAddButton)return this.uploadAddButton.uploadInput},focus(){if(this.uploadAddButton)return this.uploadAddButton.focus()},onDocumentDragEnter(){if(!this.currentDocumentActive){this.currentDocumentActive=!0;const e=()=>{this.isDragOver(this._lastDocumentDragOver)&&(this.currentDocumentActive=!1,clearInterval(this._documentInterval),this._documentInterval=null,this._lastDocumentDragOver=null)};this._documentInterval=setInterval(e,r)}},onDocumentDragOver(){this._lastDocumentDragOver=new Date},onElementDragEnter(){if(!this.currentElementActive){this.currentElementActive=!0;const e=()=>{this.isDragOver(this._lastElementDragOver)&&(this.currentElementActive=!1,clearInterval(this._elementInterval),this._elementInterval=null,this._lastElementDragOver=null)};this._elementInterval=setInterval(e,r)}},onElementDragOver(e){e.preventDefault(),this._lastElementDragOver=new Date},onDrop(e){e.preventDefault();let n=e.dataTransfer.files;n.length>0&&!this.$props.disabled&&this.$emit("add",n)},isDragOver(e){return new Date().getTime()-(e||new Date).getTime()>r},onClick(e){this.$emit("click",e)},onAdd(e){this.$emit("add",e)}},render(){const{multiple:e,disabled:n,tabIndex:l,fileGroup:u,accept:c,navigationIndex:p,notFocusedIndex:m,id:v,ariaLabelledBy:h,ariaDescribedBy:g}=this.$props,a=S.provideLocalizationService(this),D=e?a.toLanguageString(o.dropFilesHere,o.messages[o.dropFilesHere]):a.toLanguageString(o.dropFileHere,o.messages[o.dropFileHere]),[i,s,d,f]=k.getFileStatus(u),A=b.classNames("k-dropzone-hint",{"k-hidden":!this.currentElementActive}),I=i||s||d||f,E=function(){return t.createVNode(O.UploadAddButton,{id:v,ariaLabelledBy:h,ariaDescribedBy:g,ref:B=>{this.uploadAddButtonRef=B},accept:c,async:this.async,addButtonIndex:this.addButtonIndex,navigationIndex:p,notFocusedIndex:m,tabIndex:l,multiple:e,disabled:n,onClick:this.onClick,onAdd:this.onAdd},null)};return t.createVNode("div",{class:this.dropZoneClasses,onDrop:this.onDrop,onDragenter:this.onElementDragEnter,onDragover:this.onElementDragOver},[E.call(this),t.createVNode("div",{class:A},[D]),I?t.createVNode(y.UploadStatus,{isUploading:i,isUploaded:s,isUploadFailed:d},null):t.createVNode("span",{class:"k-upload-status"},null)])}});exports.UploadDropZone=F;