diff --git a/src/useDrop.ts b/src/useDrop.ts index aa92c8ceca..62ceda6621 100644 --- a/src/useDrop.ts +++ b/src/useDrop.ts @@ -1,6 +1,5 @@ /* eslint-disable */ import * as React from 'react'; -import useMountedState from './useMountedState'; const { useState, useMemo, useCallback, useEffect } = React; @@ -23,13 +22,8 @@ export interface DropAreaOptions { } const noop = () => {}; -/* -const defaultState: DropAreaState = { - over: false, -}; -*/ -const createProcess = (options: DropAreaOptions, mounted: boolean) => (dataTransfer: DataTransfer, event) => { +const createProcess = (options: DropAreaOptions) => (dataTransfer: DataTransfer, event) => { const uri = dataTransfer.getData('text/uri-list'); if (uri) { @@ -42,21 +36,18 @@ const createProcess = (options: DropAreaOptions, mounted: boolean) => (dataTrans return; } - if (dataTransfer.items && dataTransfer.items.length) { - dataTransfer.items[0].getAsString(text => { - if (mounted) { - (options.onText || noop)(text, event); - } - }); + if (event.clipboardData) { + const text = event.clipboardData.getData('text'); + (options.onText || noop)(text, event); + return; } }; const useDrop = (options: DropAreaOptions = {}, args = []): DropAreaState => { const { onFiles, onText, onUri } = options; - const isMounted = useMountedState(); const [over, setOverRaw] = useState(false); const setOver = useCallback(setOverRaw, []); - const process = useMemo(() => createProcess(options, isMounted()), [onFiles, onText, onUri]); + const process = useMemo(() => createProcess(options), [onFiles, onText, onUri]); useEffect(() => { const onDragOver = event => { diff --git a/stories/useDrop.story.tsx b/stories/useDrop.story.tsx index b9443a1cfb..43e308301e 100644 --- a/stories/useDrop.story.tsx +++ b/stories/useDrop.story.tsx @@ -1,4 +1,3 @@ -import { action } from '@storybook/addon-actions'; import { storiesOf } from '@storybook/react'; import * as React from 'react'; import { useDrop } from '../src'; @@ -6,9 +5,9 @@ import ShowDocs from './util/ShowDocs'; const Demo = () => { const state = useDrop({ - onFiles: action('onFiles'), - onUri: action('onUri'), - onText: action('onText'), + onFiles: (...args) => console.log('onFiles', ...args), + onUri: (...args) => console.log('onUri', ...args), + onText: (...args) => console.log('onText', ...args), }); const style: React.CSSProperties = {