feat(dnd): implement callback on initializing drag or resize action (#…

…1206)

Addresses #1205 

This PR would add an optional prop from the withDragAndDrop addon, that would allow users to pass a onDragStart callback to the DragAndDrop calendar, which gets called with `{ event, action, direction }` as its sole parameter.

The change is minimal, meant to serve users who need the hook and otherwise get out of the way. Open to any feedback!

examples/demos/dnd.js

@@ -83,6 +83,7 @@ class Dnd extends React.Component {
         resizable
         onEventResize={this.resizeEvent}
         onSelectSlot={this.newEvent}
+        onDragStart={console.log}
         defaultView={BigCalendar.Views.MONTH}
         defaultDate={new Date(2015, 3, 12)}
       />

src/addons/dragAndDrop/withDragAndDrop.js

@@ -23,12 +23,13 @@ import { mergeComponents } from './common'
  *
  * Set `resizable` to true in your calendar if you want events to be resizable.
  *
- * The HOC adds `onEventDrop` and `onEventResize` callback properties if the events are
+ * The HOC adds `onEventDrop`, `onEventResize`, `onDragStart` callback properties if the events are
  * moved or resized. They are called with these signatures:
  *
  * ```js
  *    function onEventDrop({ event, start, end, allDay }) {...}
  *    function onEventResize(type, { event, start, end, allDay }) {...}  // type is always 'drop'
+ *    function onDragStart({ event, action, direction }) {...}
  * ```
  *
  * Moving and resizing of events has some subtlety which one should be aware of.
@@ -53,6 +54,7 @@ export default function withDragAndDrop(Calendar) {
     static propTypes = {
       onEventDrop: PropTypes.func,
       onEventResize: PropTypes.func,
+      onDragStart: PropTypes.func,
 
       draggableAccessor: accessor,
       resizableAccessor: accessor,
@@ -114,7 +116,11 @@ export default function withDragAndDrop(Calendar) {
     }
 
     handleBeginAction = (event, action, direction) => {
+      const { onDragStart } = this.props
       this.setState({ event, action, direction })
+      if (onDragStart) {
+        onDragStart({ event, action, direction })
+      }
     }
 
     handleInteractionStart = () => {