UNPKG

@progress/kendo-vue-upload

Version:
9 lines (8 loc) 4.08 kB
/** * @license *------------------------------------------------------------------------------------------- * Copyright © 2025 Progress Software Corporation. All rights reserved. * 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"),B=require("@progress/kendo-vue-common"),E=require("./UploadAddButton.js"),b=require("@progress/kendo-vue-intl"),o=require("./messages/main.js"),O=require("./utils/utils.js"),S=require("./UploadStatus.js"),r=100,y=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:s,accept:u,navigationIndex:c,notFocusedIndex:m,id:p,ariaLabelledBy:v,ariaDescribedBy:h}=this.$props,D=b.provideLocalizationService(this).toLanguageString(o.dropFilesHere,o.messages[o.dropFilesHere]),[i,a,d,g]=O.getFileStatus(s),f=B.classNames("k-dropzone-hint",{}),I=function(){return t.createVNode(E.UploadAddButton,{id:p,ariaLabelledBy:v,ariaDescribedBy:h,ref:A=>{this.uploadAddButtonRef=A},accept:u,async:this.async,addButtonIndex:this.addButtonIndex,navigationIndex:c,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},[I.call(this),i||a||d||g?t.createVNode(S.UploadStatus,{isUploading:i,isUploaded:a,isUploadFailed:d},null):t.createVNode("div",{class:f},[D])])}});exports.UploadDropZone=y;