[d565449] | 1 | import { useMemo, useState } from 'react';
|
---|
| 2 | import useMountedState from './useMountedState';
|
---|
| 3 | import { noop } from './misc/util';
|
---|
| 4 | /*
|
---|
| 5 | const defaultState: DropAreaState = {
|
---|
| 6 | over: false,
|
---|
| 7 | };
|
---|
| 8 | */
|
---|
| 9 | var createProcess = function (options, mounted) { return function (dataTransfer, event) {
|
---|
| 10 | var uri = dataTransfer.getData('text/uri-list');
|
---|
| 11 | if (uri) {
|
---|
| 12 | (options.onUri || noop)(uri, event);
|
---|
| 13 | return;
|
---|
| 14 | }
|
---|
| 15 | if (dataTransfer.files && dataTransfer.files.length) {
|
---|
| 16 | (options.onFiles || noop)(Array.from(dataTransfer.files), event);
|
---|
| 17 | return;
|
---|
| 18 | }
|
---|
| 19 | if (dataTransfer.items && dataTransfer.items.length) {
|
---|
| 20 | dataTransfer.items[0].getAsString(function (text) {
|
---|
| 21 | if (mounted) {
|
---|
| 22 | (options.onText || noop)(text, event);
|
---|
| 23 | }
|
---|
| 24 | });
|
---|
| 25 | }
|
---|
| 26 | }; };
|
---|
| 27 | var createBond = function (process, setOver) { return ({
|
---|
| 28 | onDragOver: function (event) {
|
---|
| 29 | event.preventDefault();
|
---|
| 30 | },
|
---|
| 31 | onDragEnter: function (event) {
|
---|
| 32 | event.preventDefault();
|
---|
| 33 | setOver(true);
|
---|
| 34 | },
|
---|
| 35 | onDragLeave: function () {
|
---|
| 36 | setOver(false);
|
---|
| 37 | },
|
---|
| 38 | onDrop: function (event) {
|
---|
| 39 | event.preventDefault();
|
---|
| 40 | event.persist();
|
---|
| 41 | setOver(false);
|
---|
| 42 | process(event.dataTransfer, event);
|
---|
| 43 | },
|
---|
| 44 | onPaste: function (event) {
|
---|
| 45 | event.persist();
|
---|
| 46 | process(event.clipboardData, event);
|
---|
| 47 | },
|
---|
| 48 | }); };
|
---|
| 49 | var useDropArea = function (options) {
|
---|
| 50 | if (options === void 0) { options = {}; }
|
---|
| 51 | var onFiles = options.onFiles, onText = options.onText, onUri = options.onUri;
|
---|
| 52 | var isMounted = useMountedState();
|
---|
| 53 | var _a = useState(false), over = _a[0], setOver = _a[1];
|
---|
| 54 | var process = useMemo(function () { return createProcess(options, isMounted()); }, [onFiles, onText, onUri]);
|
---|
| 55 | var bond = useMemo(function () { return createBond(process, setOver); }, [process, setOver]);
|
---|
| 56 | return [bond, { over: over }];
|
---|
| 57 | };
|
---|
| 58 | export default useDropArea;
|
---|