• Public
  • Public/Protected
  • All

Interface UseDropNodeOptions


  • DropTargetHookSpec<DragItemNode, unknown, { isOver: boolean }>
    • UseDropNodeOptions




accept: TargetType

The kinds of dragItems this dropTarget accepts

Optional canDrop

canDrop: (item: DragItemNode, monitor: DropTargetMonitor<DragItemNode, unknown>) => boolean

Optional. Use it to specify whether the drop target is able to accept the item. If you want to always allow it, just omit this method. Specifying it is handy if you'd like to disable dropping based on some predicate over props or monitor.getItem(). Note: You may not call monitor.canDrop() inside this method.

Type declaration

Optional collect

collect: (monitor: DropTargetMonitor<DragItemNode, unknown>) => { isOver: boolean }

A function to collect rendering properties

Type declaration

    • (monitor: DropTargetMonitor<DragItemNode, unknown>): { isOver: boolean }
    • Parameters

      Returns { isOver: boolean }

      • isOver: boolean

Optional drop

drop: (item: DragItemNode, monitor: DropTargetMonitor<DragItemNode, unknown>) => unknown

Optional. Called when a compatible item is dropped on the target. You may either return undefined, or a plain object. If you return an object, it is going to become the drop result and will be available to the drag source in its endDrag method as monitor.getDropResult(). This is useful in case you want to perform different actions depending on which target received the drop. If you have nested drop targets, you can test whether a nested target has already handled drop by checking monitor.didDrop() and monitor.getDropResult(). Both this method and the source's endDrag method are good places to fire Flux actions. This method will not be called if canDrop() is defined and returns false.

Type declaration


dropLine: string

Current value of dropLine.

Optional hover

hover: (item: DragItemNode, monitor: DropTargetMonitor<DragItemNode, unknown>) => void

Optional. Called when an item is hovered over the component. You can check monitor.isOver({ shallow: true }) to test whether the hover happens over just the current target, or over a nested one. Unlike drop(), this method will be called even if canDrop() is defined and returns false. You can check monitor.canDrop() to test whether this is the case.

Type declaration


id: string

Id of the node.


nodeRef: any

The reference to the node being dragged.


onChangeDropLine: (newValue: DropLineDirection) => void

Callback called on dropLine change.

Type declaration

Optional options

options: any

The drop target options

Generated using TypeDoc