Skip to content

Commit

Permalink
fix(DND): Corrects issue of losing droppable event when releasing on …
Browse files Browse the repository at this point in the history
…non-event related containers (#2199)

#2198 #1902
  • Loading branch information
LiniovasDovydas authored Jul 1, 2022
1 parent b390e03 commit 508b668
Show file tree
Hide file tree
Showing 2 changed files with 23 additions and 3 deletions.
20 changes: 18 additions & 2 deletions src/Selection.js
Original file line number Diff line number Diff line change
Expand Up @@ -38,11 +38,12 @@ const clickTolerance = 5
const clickInterval = 250

class Selection {
constructor(node, { global = false, longPressThreshold = 250 } = {}) {
constructor(node, { global = false, longPressThreshold = 250, validContainers = [] } = {}) {
this.isDetached = false
this.container = node
this.globalMouse = !node || global
this.longPressThreshold = longPressThreshold
this.validContainers = validContainers

this._listeners = Object.create(null)

Expand Down Expand Up @@ -303,6 +304,20 @@ class Selection {
}
}

// Check whether provided event target element
// - is contained within a valid container
_isWithinValidContainer(e) {
const eventTarget = e.target;
const containers = this.validContainers;

if (!containers || !containers.length || !eventTarget) {
return true;
}

return containers.some(
(target) => !!eventTarget.closest(target));
}

_handleTerminatingEvent(e) {
const { pageX, pageY } = getEventCoordinates(e)

Expand All @@ -314,12 +329,13 @@ class Selection {
if (!this._initialEventData) return

let inRoot = !this.container || contains(this.container(), e.target)
let isWithinValidContainer = this._isWithinValidContainer(e)
let bounds = this._selectRect
let click = this.isClick(pageX, pageY)

this._initialEventData = null

if (e.key === 'Escape') {
if (e.key === 'Escape' || !isWithinValidContainer) {
return this.emit('reset')
}

Expand Down
6 changes: 5 additions & 1 deletion src/addons/dragAndDrop/WeekWrapper.js
Original file line number Diff line number Diff line change
Expand Up @@ -152,7 +152,11 @@ class WeekWrapper extends React.Component {
let node = this.ref.current.closest('.rbc-month-row, .rbc-allday-cell')
let container = node.closest('.rbc-month-view, .rbc-time-view')

let selector = (this._selector = new Selection(() => container))
let selector = (
this._selector = new Selection(
() => container,
{ validContainers: ['.rbc-day-slot', '.rbc-allday-cell'] }
))

selector.on('beforeSelect', (point) => {
const { isAllDay } = this.props
Expand Down

0 comments on commit 508b668

Please sign in to comment.