@jsxtools/aui/dist/mixins/drop.js

A baseline UI as Mixins, Custom Elements, React Components, etc.

import{InternalsMixin}from"./internals.js";var DropMixin=(Element)=>class extends InternalsMixin(Element){#drags=0;#handleDragOver(event){event.preventDefault()}#handleDragEnter(event){if(++this.#drags===1){if(this.internals.states.add("active-drop"),!this.dispatchEvent(new DragEvent("dropenter",Object.defineProperties(event,{bubbles:{value:!1}}))))event.preventDefault()}}#handleDragLeave(event){if(--this.#drags===0){if(this.internals.states.delete("active-drop"),!this.dispatchEvent(new DragEvent("dropleave",Object.defineProperties(event,{bubbles:{value:!1}}))))event.preventDefault()}}#handleDrop(event){event.preventDefault(),this.#drags=1,this.#handleDragLeave(event)}connectedCallback(){this.addEventListener("dragover",this.#handleDragOver,!0),this.addEventListener("dragenter",this.#handleDragEnter,!0),this.addEventListener("dragleave",this.#handleDragLeave,!0),this.addEventListener("drop",this.#handleDrop,!0),super.connectedCallback?.()}disconnectedCallback(){this.removeEventListener("dragover",this.#handleDragOver,!0),this.removeEventListener("dragenter",this.#handleDragEnter,!0),this.removeEventListener("dragleave",this.#handleDragLeave,!0),this.removeEventListener("drop",this.#handleDrop,!0),super.disconnectedCallback?.()}};export{DropMixin}