@benev/slate/x/tools/shockdrop/drag_drop.js

frontend web stuff

import { flat } from "../../nexus/state.js";
import { dragleave_has_exited_current_target } from "./utils/dragleave_has_exited_current_target.js";
export class ShockDragDrop {
    #params;
    constructor(params) {
        this.#params = params;
    }
    #state = flat.state({
        grabbed: undefined,
        hovering: undefined,
    });
    dragzone = {
        draggable: () => "true",
        dragstart: (grabbed) => (_) => {
            this.#state.grabbed = grabbed;
        },
        dragend: () => (_) => {
            this.#state.grabbed = undefined;
            this.#state.hovering = undefined;
        },
    };
    dropzone = {
        dragenter: () => (_) => { },
        dragleave: () => (event) => {
            if (dragleave_has_exited_current_target(event))
                this.#state.hovering = undefined;
        },
        dragover: (hovering) => (event) => {
            const { out_of_band } = this.#params;
            event.preventDefault();
            if (this.#state.grabbed || (out_of_band && out_of_band.predicate(event, hovering)))
                this.#state.hovering = hovering;
        },
        drop: (hovering) => (event) => {
            const { handle_drop, out_of_band } = this.#params;
            event.preventDefault();
            const { grabbed } = this.#state;
            this.#state.grabbed = undefined;
            this.#state.hovering = undefined;
            if (grabbed)
                handle_drop(event, grabbed, hovering);
            else if (out_of_band && out_of_band.predicate(event, hovering))
                out_of_band.handle_drop(event, hovering);
        },
    };
    get grabbed() {
        return this.#state.grabbed;
    }
    get hovering() {
        return this.#state.hovering;
    }
}
//# sourceMappingURL=drag_drop.js.map