dnd: fix drop on time-gutter

previously dropping on the time-gutter leaves calendar in drag state.

fix is to add the ability of specific drop targets and cancel/reset drag-
and-drop if the drop was not on an allowed drop target.

streamlined with [1].

[1]: jquense/react-big-calendar#1901

src/addons/dragAndDrop/WeekWrapper.js

@@ -192,8 +192,13 @@ class WeekWrapper extends React.Component {
   _selectable = () => {
     let node = findDOMNode(this).closest('.rbc-month-row, .rbc-allday-cell');
     let container = node.closest('.rbc-month-view, .rbc-time-view');
+    let allowedTargets = container.querySelectorAll(
+      '.rbc-day-slot, .rbc-allday-cell'
+    );
 
-    let selector = (this._selector = new Selection(() => container));
+    let selector = (this._selector = new Selection(() => container, {
+      allowedTargets: () => allowedTargets,
+    }));
 
     selector.on('beforeSelect', point => {
       const { isAllDay } = this.props;

src/components/selection/Selection.js

@@ -39,11 +39,12 @@ const clickInterval = 250;
 
 class Selection {
 
-  constructor(node, { global = false, longPressThreshold = 250 } = {}) {
+  constructor(node, { global = false, longPressThreshold = 250, allowedTargets = () => [] } = {}) {
     this.isDetached = false;
     this.container = node;
     this.globalMouse = !node || global;
     this.longPressThreshold = longPressThreshold;
+    this.getAllowedTargets = allowedTargets;
     this._listeners = Object.create(null);
     this._handleInitialEvent = this._handleInitialEvent.bind(this);
     this._handleMoveEvent = this._handleMoveEvent.bind(this);
@@ -311,6 +312,7 @@ class Selection {
     if (!this._initialEventData) return;
 
     let inRoot = !this.container || contains(this.container(), e.target);
+    let inAllowedTarget = this._checkIfInAllowedTarget(e);
     let bounds = this._selectRect;
     let click = this.isClick(pageX, pageY);
 
@@ -320,7 +322,7 @@ class Selection {
       return this.emit('reset');
     }
 
-    if (!inRoot) {
+    if (!inRoot || !inAllowedTarget) {
       return this.emit('reset');
     }
 
@@ -332,6 +334,19 @@ class Selection {
     if (!click) return this.emit('select', bounds);
   }
 
+  _checkIfInAllowedTarget(e) {
+    let allowedTargets = this.getAllowedTargets();
+    if (!allowedTargets || !allowedTargets.length) return true;
+    let inAllowedTarget = false;
+    allowedTargets.forEach(n => {
+      if (contains(n, e.target)) {
+        inAllowedTarget = true;
+      }
+    });
+
+    return inAllowedTarget;
+  }
+
   _handleClickEvent(e) {
     const { pageX, pageY, clientX, clientY } = getEventCoordinates(e);
     const now = new Date().getTime();