Cursor position and drag state breaks during multi-week drags

[tyler-dane]

Where did this happen?

Hosted (compasscalendar.com)

Expected Behavior

When dragging an event across weeks:

1. The mouse position should be restricted to the drop zones.

• Currently, those valid drop zones are the main grid or all-day row (whichever the original event was).
• In the future, valid drop zones will be the timed grid, all-day row, or sidebar.

2. The cursor should stay as move

3. The cursor should stay connected to the event it's dragging

Current Behavior

drag-bad.mov

The user can move their mouse outside the grid, despite the event placeholder staying on the grid. 👎

When the user's mouse is outside the grid and hovers their cursor over other elements (like 'Add to week' button), the drag cursor style is overridden 👎 .

There is a large gap between the cursor and the event it's dragging 👎

Steps to Reproduce

1. Drag an event across weeks
2. While the mouse is still down, move the cursor outside of the grid (near the header or sidebar)
3. Notice: the mouse position is lost

Possible Solution

No response

Context

This is poor UX that'll result in users becoming reluctant to use Compass altogether