Skip to content

Plan for new dnd interfaces

Stephen Mckellar edited this page Dec 5, 2017 · 2 revisions

DragContext()

  • creates store context

// For making things interactive

DragSource() => { } makes it draggable

  • is type
  • this.onDragStart() // return props
  • updates context
  • cb this.onDrop();

DropTarget() => { responds to events, makes it droppable

  • accepts type
  • cb this.onDrop();

// For attaching drag state to props

DragSourceMonitor() => { isDragging() getItemType() getItem() }

DropTargetMonitor() => { } isOver() isCompatableTarget()

DragLayerMonitor() => { isDragging() getItemType() getItem() }

// Misc data structure related things

accepts: [Symbol('foo')]

context = { active: sourceId, sources: [{isDragging}], targets: [{isOver}] };