react-drag-drop-files/.rollup.cache/Users/karimmokhtar/E/garbage/react-drag-drop-files/dist/src/useDragging.js

Light React Drag & Drop files and images library styled by styled-components

import { useState, useEffect, useCallback } from 'react';
var draggingCount = 0;
/**
 *
 * @param data - labelRef, inputRef, handleChanges, onDrop
 * @returns boolean - the state.
 *
 * @internal
 */
export default function useDragging(_a) {
    var labelRef = _a.labelRef, inputRef = _a.inputRef, multiple = _a.multiple, handleChanges = _a.handleChanges, onDrop = _a.onDrop;
    var _b = useState(false), dragging = _b[0], setDragging = _b[1];
    var handleClick = useCallback(function () {
        inputRef.current.click();
    }, [inputRef]);
    var handleDragIn = useCallback(function (ev) {
        ev.preventDefault();
        ev.stopPropagation();
        draggingCount++;
        if (ev.dataTransfer.items && ev.dataTransfer.items.length !== 0) {
            setDragging(true);
        }
    }, []);
    var handleDragOut = useCallback(function (ev) {
        ev.preventDefault();
        ev.stopPropagation();
        draggingCount--;
        if (draggingCount > 0)
            return;
        setDragging(false);
    }, []);
    var handleDrag = useCallback(function (ev) {
        ev.preventDefault();
        ev.stopPropagation();
    }, []);
    var handleDrop = useCallback(function (ev) {
        ev.preventDefault();
        ev.stopPropagation();
        setDragging(false);
        draggingCount = 0;
        var eventFiles = ev.dataTransfer.files;
        if (eventFiles && eventFiles.length > 0) {
            var files = multiple ? eventFiles : eventFiles[0];
            var success = handleChanges(files);
            if (onDrop && success)
                onDrop(files);
        }
    }, [handleChanges]);
    useEffect(function () {
        var ele = labelRef.current;
        ele.addEventListener('click', handleClick);
        ele.addEventListener('dragenter', handleDragIn);
        ele.addEventListener('dragleave', handleDragOut);
        ele.addEventListener('dragover', handleDrag);
        ele.addEventListener('drop', handleDrop);
        return function () {
            ele.removeEventListener('click', handleClick);
            ele.removeEventListener('dragenter', handleDragIn);
            ele.removeEventListener('dragleave', handleDragOut);
            ele.removeEventListener('dragover', handleDrag);
            ele.removeEventListener('drop', handleDrop);
        };
    }, [
        handleClick,
        handleDragIn,
        handleDragOut,
        handleDrag,
        handleDrop,
        labelRef
    ]);
    return dragging;
}
//# sourceMappingURL=useDragging.js.map