@atlaskit/pragmatic-drag-and-drop 0.17.0

package/dist/cjs/make-adapter/make-drop-target.js

@@ -0,0 +1,271 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.makeDropTarget = makeDropTarget;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _addAttribute = require("../util/add-attribute");
+var _combine = require("../util/combine");
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function copyReverse(array) {
+  return array.slice(0).reverse();
+}
+function makeDropTarget(_ref) {
+  var typeKey = _ref.typeKey,
+    defaultDropEffect = _ref.defaultDropEffect;
+  var registry = new WeakMap();
+  var dropTargetDataAtt = "data-drop-target-for-".concat(typeKey);
+  var dropTargetSelector = "[".concat(dropTargetDataAtt, "]");
+  function addToRegistry(args) {
+    registry.set(args.element, args);
+    return function () {
+      return registry.delete(args.element);
+    };
+  }
+  function dropTargetForConsumers(args) {
+    // Guardrail: warn if the draggable element is already registered
+    if (process.env.NODE_ENV !== 'production') {
+      var existing = registry.get(args.element);
+      if (existing) {
+        // eslint-disable-next-line no-console
+        console.warn('You have already registered a `droppable` on the same element', {
+          existing: existing,
+          proposed: args
+        });
+      }
+    }
+    return (0, _combine.combine)((0, _addAttribute.addAttribute)(args.element, {
+      attribute: dropTargetDataAtt,
+      value: 'true'
+    }), addToRegistry(args));
+  }
+  function getActualDropTargets(_ref2) {
+    var _args$getData, _args$getData2, _args$getDropEffect, _args$getDropEffect2, _args$getIsSticky;
+    var source = _ref2.source,
+      target = _ref2.target,
+      input = _ref2.input,
+      _ref2$result = _ref2.result,
+      result = _ref2$result === void 0 ? [] : _ref2$result;
+    if (!(target instanceof Element)) {
+      return result;
+    }
+    var closest = target.closest(dropTargetSelector);
+
+    // Cannot find anything else
+    if (closest == null) {
+      return result;
+    }
+    var args = registry.get(closest);
+
+    // error: something had a dropTargetSelector but we could not
+    // find a match. For now, failing silently
+    if (args == null) {
+      return result;
+    }
+    var feedback = {
+      input: input,
+      source: source,
+      element: args.element
+    };
+
+    // if dropping is not allowed, skip this drop target
+    // and continue looking up the DOM tree
+    if (args.canDrop && !args.canDrop(feedback)) {
+      return getActualDropTargets({
+        source: source,
+        target: args.element.parentElement,
+        input: input,
+        result: result
+      });
+    }
+    var data = (_args$getData = (_args$getData2 = args.getData) === null || _args$getData2 === void 0 ? void 0 : _args$getData2.call(args, feedback)) !== null && _args$getData !== void 0 ? _args$getData : {};
+    var dropEffect = (_args$getDropEffect = (_args$getDropEffect2 = args.getDropEffect) === null || _args$getDropEffect2 === void 0 ? void 0 : _args$getDropEffect2.call(args, feedback)) !== null && _args$getDropEffect !== void 0 ? _args$getDropEffect : defaultDropEffect;
+    var sticky = Boolean((_args$getIsSticky = args.getIsSticky) === null || _args$getIsSticky === void 0 ? void 0 : _args$getIsSticky.call(args, feedback));
+    var record = {
+      data: data,
+      element: args.element,
+      dropEffect: dropEffect,
+      sticky: sticky
+    };
+    return getActualDropTargets({
+      source: source,
+      target: args.element.parentElement,
+      input: input,
+      // Using bubble ordering. Same ordering as `event.getPath()`
+      result: [].concat((0, _toConsumableArray2.default)(result), [record])
+    });
+  }
+  function notifyCurrent(_ref3) {
+    var eventName = _ref3.eventName,
+      payload = _ref3.payload;
+    var _iterator = _createForOfIteratorHelper(payload.location.current.dropTargets),
+      _step;
+    try {
+      for (_iterator.s(); !(_step = _iterator.n()).done;) {
+        var _entry$eventName;
+        var record = _step.value;
+        var entry = registry.get(record.element);
+        var _args = _objectSpread(_objectSpread({}, payload), {}, {
+          self: record
+        });
+        entry === null || entry === void 0 ? void 0 : (_entry$eventName = entry[eventName]) === null || _entry$eventName === void 0 ? void 0 : _entry$eventName.call(entry,
+        // I cannot seem to get the types right here.
+        // TS doesn't seem to like that one event can need `nativeSetDragImage`
+        // @ts-expect-error
+        _args);
+      }
+    } catch (err) {
+      _iterator.e(err);
+    } finally {
+      _iterator.f();
+    }
+  }
+  var actions = {
+    onGenerateDragPreview: notifyCurrent,
+    onDrag: notifyCurrent,
+    onDragStart: notifyCurrent,
+    onDrop: notifyCurrent,
+    onDropTargetChange: function onDropTargetChange(_ref4) {
+      var payload = _ref4.payload;
+      var isCurrent = new Set(payload.location.current.dropTargets.map(function (record) {
+        return record.element;
+      }));
+      var visited = new Set();
+      var _iterator2 = _createForOfIteratorHelper(payload.location.previous.dropTargets),
+        _step2;
+      try {
+        for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
+          var _entry$onDropTargetCh;
+          var record = _step2.value;
+          visited.add(record.element);
+          var entry = registry.get(record.element);
+          var isOver = isCurrent.has(record.element);
+          var _args2 = _objectSpread(_objectSpread({}, payload), {}, {
+            self: record
+          });
+          entry === null || entry === void 0 ? void 0 : (_entry$onDropTargetCh = entry.onDropTargetChange) === null || _entry$onDropTargetCh === void 0 ? void 0 : _entry$onDropTargetCh.call(entry, _args2);
+
+          // if we cannot find the drop target in the current array, then it has been left
+          if (!isOver) {
+            var _entry$onDragLeave;
+            entry === null || entry === void 0 ? void 0 : (_entry$onDragLeave = entry.onDragLeave) === null || _entry$onDragLeave === void 0 ? void 0 : _entry$onDragLeave.call(entry, _args2);
+          }
+        }
+      } catch (err) {
+        _iterator2.e(err);
+      } finally {
+        _iterator2.f();
+      }
+      var _iterator3 = _createForOfIteratorHelper(payload.location.current.dropTargets),
+        _step3;
+      try {
+        for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
+          var _entry$onDropTargetCh2, _entry$onDragEnter;
+          var _record = _step3.value;
+          // already published an update to this drop target
+          if (visited.has(_record.element)) {
+            continue;
+          }
+          // at this point we have a new drop target that is being entered into
+          var _args3 = _objectSpread(_objectSpread({}, payload), {}, {
+            self: _record
+          });
+          var _entry = registry.get(_record.element);
+          _entry === null || _entry === void 0 ? void 0 : (_entry$onDropTargetCh2 = _entry.onDropTargetChange) === null || _entry$onDropTargetCh2 === void 0 ? void 0 : _entry$onDropTargetCh2.call(_entry, _args3);
+          _entry === null || _entry === void 0 ? void 0 : (_entry$onDragEnter = _entry.onDragEnter) === null || _entry$onDragEnter === void 0 ? void 0 : _entry$onDragEnter.call(_entry, _args3);
+        }
+      } catch (err) {
+        _iterator3.e(err);
+      } finally {
+        _iterator3.f();
+      }
+    }
+  };
+  function dispatchEvent(args) {
+    // This line does not work in TS 4.2
+    // It does work in TS 4.7
+    // @ts-expect-error
+    actions[args.eventName](args);
+  }
+  function getIsOver(_ref5) {
+    var source = _ref5.source,
+      target = _ref5.target,
+      input = _ref5.input,
+      current = _ref5.current;
+    var actual = getActualDropTargets({
+      source: source,
+      target: target,
+      input: input
+    });
+
+    // stickiness is only relevant when we have less
+    // drop targets than we did before
+    if (actual.length >= current.length) {
+      return actual;
+    }
+
+    // less 'actual' drop targets than before,
+    // we need to see if 'stickiness' applies
+
+    // An old drop target will continue to be dropped on if:
+    // 1. it has the same parent
+    // 2. nothing exists in it's previous index
+
+    var lastCaptureOrdered = copyReverse(current);
+    var actualCaptureOrdered = copyReverse(actual);
+    var resultCaptureOrdered = [];
+    for (var index = 0; index < lastCaptureOrdered.length; index++) {
+      var last = lastCaptureOrdered[index];
+      var fresh = actualCaptureOrdered[index];
+
+      // if a record is in the new index -> use that
+      // it will have the latest data + dropEffect
+      if (fresh != null) {
+        resultCaptureOrdered.push(fresh);
+        continue;
+      }
+
+      // At this point we have no drop target in the old spot
+      // Check to see if we can use a previous sticky drop target
+
+      // stickiness is based on relationships to a parent
+      // so if we hit a drop target that is not sticky we
+      // can finish our search
+      if (!last.sticky) {
+        break;
+      }
+
+      // We only want the previous sticky item to 'stick' if
+      // the parent of the sticky item is unchanged
+
+      // The "parent" is the one inside of `resultCaptureOrdered`
+      // (the parent might be a drop target that was sticky)
+      var parent = resultCaptureOrdered[index - 1];
+      var lastParent = lastCaptureOrdered[index - 1];
+
+      // parents are the same (might both be undefined for index == 0)
+      // we can add the last entry and keep searching
+      if ((parent === null || parent === void 0 ? void 0 : parent.element) === (lastParent === null || lastParent === void 0 ? void 0 : lastParent.element)) {
+        resultCaptureOrdered.push(last);
+        continue;
+      }
+      // parents are not the same, we can exit our search
+      break;
+    }
+
+    // return bubble ordered result
+    return copyReverse(resultCaptureOrdered);
+  }
+  return {
+    dropTargetForConsumers: dropTargetForConsumers,
+    getIsOver: getIsOver,
+    dispatchEvent: dispatchEvent
+  };
+}

package/dist/cjs/make-adapter/make-monitor.js

@@ -0,0 +1,100 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.makeMonitor = makeMonitor;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function makeMonitor() {
+  var registry = new Set();
+  var dragging = null;
+  function tryAddToActive(monitor) {
+    if (!dragging) {
+      return;
+    }
+    // Monitor is allowed to monitor events if:
+    // 1. It has no `canMonitor` function (default is that a monitor can listen to everything)
+    // 2. `canMonitor` returns true
+    if (!monitor.canMonitor || monitor.canMonitor(dragging.canMonitorArgs)) {
+      dragging.active.add(monitor);
+    }
+  }
+  function monitorForConsumers(args) {
+    // We are giving each `args` a new reference so that you
+    // can create multiple monitors with the same `args`.
+    var entry = _objectSpread({}, args);
+    registry.add(entry);
+
+    // if there is an active drag we need to see if this new monitor is relevant
+    tryAddToActive(entry);
+    return function cleanup() {
+      registry.delete(entry);
+
+      // We need to stop publishing events during a drag to this monitor!
+      if (dragging) {
+        dragging.active.delete(entry);
+      }
+    };
+  }
+  function dispatchEvent(_ref) {
+    var eventName = _ref.eventName,
+      payload = _ref.payload;
+    if (eventName === 'onGenerateDragPreview') {
+      dragging = {
+        canMonitorArgs: {
+          initial: payload.location.initial,
+          source: payload.source
+        },
+        active: new Set()
+      };
+      var _iterator = _createForOfIteratorHelper(registry),
+        _step;
+      try {
+        for (_iterator.s(); !(_step = _iterator.n()).done;) {
+          var monitor = _step.value;
+          tryAddToActive(monitor);
+        }
+      } catch (err) {
+        _iterator.e(err);
+      } finally {
+        _iterator.f();
+      }
+    }
+
+    // This should never happen.
+    if (!dragging) {
+      return;
+    }
+
+    // Creating an array from the set _before_ iterating
+    // This is so that monitors added during the current event will not be called.
+    // This behaviour matches native EventTargets where an event listener
+    // cannot add another event listener during an active event to the same
+    // event target in the same event (for us we have a single global event target)
+    var active = Array.from(dragging.active);
+    for (var _i = 0, _active = active; _i < _active.length; _i++) {
+      var _monitor = _active[_i];
+      // A monitor can be removed by another monitor during an event.
+      // We need to check that the monitor is still registered before calling it
+      if (dragging.active.has(_monitor)) {
+        var _monitor$eventName;
+        // @ts-expect-error: I cannot get this type working!
+        (_monitor$eventName = _monitor[eventName]) === null || _monitor$eventName === void 0 ? void 0 : _monitor$eventName.call(_monitor, payload);
+      }
+    }
+    if (eventName === 'onDrop') {
+      dragging.active.clear();
+      dragging = null;
+    }
+  }
+  return {
+    dispatchEvent: dispatchEvent,
+    monitorForConsumers: monitorForConsumers
+  };
+}

package/dist/cjs/util/add-attribute.js

@@ -0,0 +1,14 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.addAttribute = addAttribute;
+function addAttribute(element, _ref) {
+  var attribute = _ref.attribute,
+    value = _ref.value;
+  element.setAttribute(attribute, value);
+  return function () {
+    return element.removeAttribute(attribute);
+  };
+}

package/dist/cjs/util/combine.js

@@ -0,0 +1,17 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.combine = combine;
+/** Create a new combined function that will call all the provided functions */
+function combine() {
+  for (var _len = arguments.length, fns = new Array(_len), _key = 0; _key < _len; _key++) {
+    fns[_key] = arguments[_key];
+  }
+  return function cleanup() {
+    fns.forEach(function (fn) {
+      return fn();
+    });
+  };
+}

package/dist/cjs/util/disable-native-drag-preview.js

@@ -0,0 +1,36 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.disableNativeDragPreview = disableNativeDragPreview;
+// In order to disable the native drag preview you can
+// use `event.dataTransfer.setDragImage()` to set a small
+// invisible image as the drag preview.
+// There are alternative techniques,
+// (eg setting opacity to in onGenerateDragPreview and then 1 in onDragStart)
+// but the technique in this file worked best across browsers and platforms
+
+// Here we are preloading the image so that it is ready for the first drag.
+// Even though the image is base64 encoded, the browser queues an async task
+// to decode the image. The image needs to be decoded before it can be used
+var tinyTransparentImage = function () {
+  // SSR safe
+  if (typeof window === 'undefined') {
+    return null;
+  }
+
+  // Image generated by: https://png-pixel.com/
+  // It is a 1x1 transparent gif
+  // It is the smallest possible transparent image we could find that works on all platforms
+  // Note: using an encoded SVG would be nicer code, but it doesn't work on iOS
+  var img = new Image();
+  img.src = 'data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==';
+  return img;
+}();
+function disableNativeDragPreview(_ref) {
+  var nativeSetDragImage = _ref.nativeSetDragImage;
+  if (nativeSetDragImage && tinyTransparentImage) {
+    nativeSetDragImage(tinyTransparentImage, 0, 0);
+  }
+}

package/dist/cjs/util/entering-and-leaving-the-window.js

@@ -0,0 +1,162 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.isEnteringWindow = isEnteringWindow;
+exports.isLeavingWindow = isLeavingWindow;
+var _bindEventListener = require("bind-event-listener");
+// *Usually* to detect if you are entering / leaving a window you can
+// use the `event.relatedTarget` property:
+
+// "dragenter":
+// - `event.relatedTarget` should point to the element that you are coming from
+//   - Scenario: A -> B
+//   - `event.target`: `B` (entering B)
+//   - `event.relatedTarget`: `A`: (leaving A - where you are coming from)
+// - if `event.relatedTarget` is `null` then you are entering the window (coming from `null`)
+//
+// "dragleave"
+// - `event.relatedTarget` should point to the element you are going to
+//   - Scenario: A -> B (entered B, leaving A)
+//   - `event.target`: `A` (leaving A)
+//   - `event.relatedTarget`: `B`: (entering into B - where you are going to)
+// - if `event.relatedTarget` is `null` then you are leaving the window (going to `null`)
+//
+// Unfortunately in Safari `event.relatedTarget` is *always* set to `null`
+// Safari bug: https://bugs.webkit.org/show_bug.cgi?id=242627
+// To work around this we count "dragenter" and "dragleave" events
+var safariFix = {
+  isSafari: false,
+  // Using symbols for event properties so we don't clash with
+  // anything on the `event` object
+  leavingWindow: Symbol('leaving'),
+  enteringWindow: Symbol('entering')
+};
+function isEnteringWindow(_ref) {
+  var dragEnter = _ref.dragEnter;
+  if (dragEnter.type !== 'dragenter') {
+    return false;
+  }
+  if (safariFix.isSafari) {
+    return dragEnter.hasOwnProperty(safariFix.enteringWindow);
+  }
+  // This is the standard check.
+  // if `relatedTarget` is `null` during a "dragenter"
+  // then we are entering the`window`
+  return dragEnter.relatedTarget == null;
+}
+function isLeavingWindow(_ref2) {
+  var dragLeave = _ref2.dragLeave;
+  if (dragLeave.type !== 'dragleave') {
+    return false;
+  }
+  if (safariFix.isSafari) {
+    return dragLeave.hasOwnProperty(safariFix.leavingWindow);
+  }
+  // This is the standard check.
+  // if `relatedTarget` is `null` during a "dragleave"
+  // then we are leave the `window`
+  return dragLeave.relatedTarget == null;
+}
+
+// NOTE: this fix currently has no test coverage
+// - our drag and drop browser tests currently only run in Chrome due to tooling limitations
+// - it didn't feel helpful to unit test as it is merely replicating a bug
+
+(function fixSafari() {
+  // Don't do anything when server side rendering
+  if (typeof window === 'undefined') {
+    return;
+  }
+
+  // rather than checking the userAgent for "jsdom" we can do this check
+  // so that the check will be removed completely in production code
+  if (process.env.NODE_ENV === 'test') {
+    return;
+  }
+  var _navigator = navigator,
+    userAgent = _navigator.userAgent;
+  var isSafari = userAgent.includes('AppleWebKit') && !userAgent.includes('Chrome');
+  if (!isSafari) {
+    return;
+  }
+  safariFix.isSafari = true;
+  function getInitialState() {
+    return {
+      enterCount: 0,
+      isOverWindow: false
+    };
+  }
+  var state = getInitialState();
+  function resetState() {
+    state = getInitialState();
+  }
+
+  // These event listeners are bound _forever_ and _never_ removed
+  // We don't bother cleaning up these event listeners (for now)
+  // as this workaround is only for Safari
+
+  // This is how the event count works:
+  //
+  // lift (+1 enterCount)
+  // - dragstart(draggable) [enterCount: 0]
+  // - dragenter(draggable) [enterCount: 1]
+  // leaving draggable (+0 enterCount)
+  // - dragenter(document.body) [enterCount: 2]
+  // - dragleave(draggable) [enterCount: 1]
+  // leaving window (-1 enterCount)
+  // - dragleave(document.body) [enterCount: 0] {leaving the window}
+
+  // Things to note:
+  // - dragenter and dragleave bubble
+  // - the first dragenter when entering a window might not be on `window`
+  //   - it could be on an element that is pressed up against the window
+  //   - (so we cannot rely on `event.target` values)
+
+  (0, _bindEventListener.bindAll)(window, [{
+    type: 'dragstart',
+    listener: function listener() {
+      state.enterCount = 0;
+      // drag start occurs in the source window
+      state.isOverWindow = true;
+
+      // When a drag first starts it will also trigger a "dragenter" on the draggable element
+    }
+  }, {
+    type: 'drop',
+    listener: resetState
+  }, {
+    type: 'dragend',
+    listener: resetState
+  }, {
+    type: 'dragenter',
+    listener: function listener(event) {
+      if (!state.isOverWindow && state.enterCount === 0) {
+        // Patching the `event` object
+        // The `event` object is shared with all event listeners for the event
+        // @ts-ignore
+        event[safariFix.enteringWindow] = true;
+      }
+      state.isOverWindow = true;
+      state.enterCount++;
+    }
+  }, {
+    type: 'dragleave',
+    listener: function listener(event) {
+      state.enterCount--;
+      if (state.isOverWindow && state.enterCount === 0) {
+        // Patching the `event` object as it is shared with all event listeners
+        // The `event` object is shared with all event listeners for the event
+        // @ts-ignore
+        event[safariFix.leavingWindow] = true;
+        state.isOverWindow = false;
+      }
+    }
+  }],
+  // using `capture: true` so that adding event listeners
+  // in bubble phase will have the correct symbols
+  {
+    capture: true
+  });
+})();