[d565449] | 1 | import { __spreadArrays } from "tslib";
|
---|
| 2 | import { useCallback, useEffect, useMemo, useState } from 'react';
|
---|
| 3 | import { noop, off, on } from './misc/util';
|
---|
| 4 | var createProcess = function (options) { return function (dataTransfer, event) {
|
---|
| 5 | var uri = dataTransfer.getData('text/uri-list');
|
---|
| 6 | if (uri) {
|
---|
| 7 | (options.onUri || noop)(uri, event);
|
---|
| 8 | return;
|
---|
| 9 | }
|
---|
| 10 | if (dataTransfer.files && dataTransfer.files.length) {
|
---|
| 11 | (options.onFiles || noop)(Array.from(dataTransfer.files), event);
|
---|
| 12 | return;
|
---|
| 13 | }
|
---|
| 14 | if (event.clipboardData) {
|
---|
| 15 | var text = event.clipboardData.getData('text');
|
---|
| 16 | (options.onText || noop)(text, event);
|
---|
| 17 | return;
|
---|
| 18 | }
|
---|
| 19 | }; };
|
---|
| 20 | var useDrop = function (options, args) {
|
---|
| 21 | if (options === void 0) { options = {}; }
|
---|
| 22 | if (args === void 0) { args = []; }
|
---|
| 23 | var onFiles = options.onFiles, onText = options.onText, onUri = options.onUri;
|
---|
| 24 | var _a = useState(false), over = _a[0], setOverRaw = _a[1];
|
---|
| 25 | var setOver = useCallback(setOverRaw, []);
|
---|
| 26 | var process = useMemo(function () { return createProcess(options); }, [onFiles, onText, onUri]);
|
---|
| 27 | useEffect(function () {
|
---|
| 28 | var onDragOver = function (event) {
|
---|
| 29 | event.preventDefault();
|
---|
| 30 | setOver(true);
|
---|
| 31 | };
|
---|
| 32 | var onDragEnter = function (event) {
|
---|
| 33 | event.preventDefault();
|
---|
| 34 | setOver(true);
|
---|
| 35 | };
|
---|
| 36 | var onDragLeave = function () {
|
---|
| 37 | setOver(false);
|
---|
| 38 | };
|
---|
| 39 | var onDragExit = function () {
|
---|
| 40 | setOver(false);
|
---|
| 41 | };
|
---|
| 42 | var onDrop = function (event) {
|
---|
| 43 | event.preventDefault();
|
---|
| 44 | setOver(false);
|
---|
| 45 | process(event.dataTransfer, event);
|
---|
| 46 | };
|
---|
| 47 | var onPaste = function (event) {
|
---|
| 48 | process(event.clipboardData, event);
|
---|
| 49 | };
|
---|
| 50 | on(document, 'dragover', onDragOver);
|
---|
| 51 | on(document, 'dragenter', onDragEnter);
|
---|
| 52 | on(document, 'dragleave', onDragLeave);
|
---|
| 53 | on(document, 'dragexit', onDragExit);
|
---|
| 54 | on(document, 'drop', onDrop);
|
---|
| 55 | if (onText) {
|
---|
| 56 | on(document, 'paste', onPaste);
|
---|
| 57 | }
|
---|
| 58 | return function () {
|
---|
| 59 | off(document, 'dragover', onDragOver);
|
---|
| 60 | off(document, 'dragenter', onDragEnter);
|
---|
| 61 | off(document, 'dragleave', onDragLeave);
|
---|
| 62 | off(document, 'dragexit', onDragExit);
|
---|
| 63 | off(document, 'drop', onDrop);
|
---|
| 64 | off(document, 'paste', onPaste);
|
---|
| 65 | };
|
---|
| 66 | }, __spreadArrays([process], args));
|
---|
| 67 | return { over: over };
|
---|
| 68 | };
|
---|
| 69 | export default useDrop;
|
---|