Accept dragged content from the browser or the desktop.

Use in your code Learn more
bit import khan.react-components/components/drag-target

Accept dragged content from the browser or the desktop.

Example

var Target = React.createClass({
    render: function() {
        return <DragTarget onDrop={this.handleDrop}>
            {this.state.message}
        </DragTarget>;
    },
    handleDrop: function(event) {
        this.setState({ message: "delicious. thank you!" });
    },
    getInitialState: function() {
        return { message: "I haven't received any drags" };
    }
});
return <Target />;
NameTypeDescription
onDropPropTypes.func
componentPropTypes.any
shouldDragHighlightPropTypes.func
stylePropTypes.any

Test Summary

DragTarget shows hover at the appropriate timesPass
DragTarget accepts dropsPass