npm - @planningcenter/react-beautiful-dnd - Versions diffs - 13.4.0 → 13.4.1 - Mend

@planningcenter/react-beautiful-dnd 13.4.0 → 13.4.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (7) hide show

package/dist/react-beautiful-dnd.cjs.js +229 -205
package/dist/react-beautiful-dnd.esm.js +209 -180
package/dist/react-beautiful-dnd.js +614 -507
package/dist/react-beautiful-dnd.min.js +6 -1
package/package.json +11 -11
package/src/view/droppable/connected-droppable.js +50 -25
package/CHANGELOG.md +0 -78

package/dist/react-beautiful-dnd.js CHANGED Viewed

@@ -1,11 +1,8 @@
 (function (global, factory) {
   typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react'), require('react-dom')) :
   typeof define === 'function' && define.amd ? define(['exports', 'react', 'react-dom'], factory) :
-  (global = global || self, factory(global.ReactBeautifulDnd = {}, global.React, global.ReactDOM));
-}(this, (function (exports, React, ReactDOM) { 'use strict';
-  var React__default = 'default' in React ? React['default'] : React;
-  var ReactDOM__default = 'default' in ReactDOM ? ReactDOM['default'] : ReactDOM;
+  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.ReactBeautifulDnd = {}, global.React, global.ReactDOM));
+})(this, (function (exports, React, ReactDOM) { 'use strict';
   function _inheritsLoose(subClass, superClass) {
     subClass.prototype = Object.create(superClass.prototype);
@@ -16,12 +13,12 @@
   var spacesAndTabs = /[ \t]{2,}/g;
   var lineStartWithSpaces = /^[ \t]*/gm;
-  var clean = function clean(value) {
+  var clean$2 = function clean(value) {
     return value.replace(spacesAndTabs, ' ').replace(lineStartWithSpaces, '').trim();
   };
   var getDevMessage = function getDevMessage(message) {
-    return clean("\n  %creact-beautiful-dnd\n\n  %c" + clean(message) + "\n\n  %c\uD83D\uDC77\u200D This is a development only message. It will be removed in production builds.\n");
+    return clean$2("\n  %creact-beautiful-dnd\n\n  %c" + clean$2(message) + "\n\n  %c\uD83D\uDC77\u200D This is a development only message. It will be removed in production builds.\n");
   };
   var getFormattedMessage = function getFormattedMessage(message) {
@@ -37,13 +34,13 @@
     (_console = console)[type].apply(_console, getFormattedMessage(message));
   }
-  var warning = log.bind(null, 'warn');
+  var warning$2 = log.bind(null, 'warn');
   var error = log.bind(null, 'error');
-  function noop() {}
+  function noop$2() {}
-  function _extends() {
-    _extends = Object.assign || function (target) {
+  function _extends$1() {
+    _extends$1 = Object.assign || function (target) {
       for (var i = 1; i < arguments.length; i++) {
         var source = arguments[i];
@@ -57,11 +54,11 @@
       return target;
     };
-    return _extends.apply(this, arguments);
+    return _extends$1.apply(this, arguments);
   }
   function getOptions(shared, fromBinding) {
-    return _extends({}, shared, {}, fromBinding);
+    return _extends$1({}, shared, {}, fromBinding);
   }
   function bindEvents(el, bindings, sharedOptions) {
@@ -79,7 +76,8 @@
     };
   }
-  var prefix = 'Invariant failed';
+  var isProduction$1 = "development" === 'production';
+  var prefix$2 = 'Invariant failed';
   function RbdInvariant(message) {
     this.message = message;
   }
@@ -88,13 +86,15 @@
     return this.message;
   };
-  function invariant(condition, message) {
+  function invariant$1(condition, message) {
     if (condition) {
       return;
     }
-    {
-      throw new RbdInvariant(prefix + ": " + (message || ''));
+    if (isProduction$1) {
+      throw new RbdInvariant(prefix$2);
+    } else {
+      throw new RbdInvariant(prefix$2 + ": " + (message || ''));
     }
   }
@@ -110,14 +110,14 @@
       _this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;
       _this.callbacks = null;
-      _this.unbind = noop;
+      _this.unbind = noop$2;
       _this.onWindowError = function (event) {
         var callbacks = _this.getCallbacks();
         if (callbacks.isDragging()) {
           callbacks.tryAbort();
-           warning("\n        An error was caught by our window 'error' event listener while a drag was occurring.\n        The active drag has been aborted.\n      ") ;
+          warning$2("\n        An error was caught by our window 'error' event listener while a drag was occurring.\n        The active drag has been aborted.\n      ") ;
         }
         var err = event.error;
@@ -177,7 +177,7 @@
     };
     return ErrorBoundary;
-  }(React__default.Component);
+  }(React.Component);
   var dragHandleUsageInstructions = "\n  Press space bar to start a drag.\n  When dragging you can use the arrow keys to move the item around and escape to cancel.\n  Some screen readers may require you to be in focus mode or to use your pass through key\n";
@@ -256,6 +256,7 @@
     onDragUpdate: onDragUpdate,
     onDragEnd: onDragEnd
   };
+  var preset$1 = preset;
   function symbolObservablePonyfill(root) {
   	var result;
@@ -315,7 +316,7 @@
    * @param {any} obj The object to inspect.
    * @returns {boolean} True if the argument appears to be a plain object.
    */
-  function isPlainObject(obj) {
+  function isPlainObject$1(obj) {
     if (typeof obj !== 'object' || obj === null) return false;
     var proto = obj;
@@ -352,7 +353,7 @@
    * and subscribe to changes.
    */
-  function createStore(reducer, preloadedState, enhancer) {
+  function createStore$1(reducer, preloadedState, enhancer) {
     var _ref2;
     if (typeof preloadedState === 'function' && typeof enhancer === 'function' || typeof enhancer === 'function' && typeof arguments[3] === 'function') {
@@ -369,7 +370,7 @@
         throw new Error('Expected the enhancer to be a function.');
       }
-      return enhancer(createStore)(reducer, preloadedState);
+      return enhancer(createStore$1)(reducer, preloadedState);
     }
     if (typeof reducer !== 'function') {
@@ -489,7 +490,7 @@
     function dispatch(action) {
-      if (!isPlainObject(action)) {
+      if (!isPlainObject$1(action)) {
         throw new Error('Actions must be plain objects. ' + 'Use custom middleware for async actions.');
       }
@@ -807,7 +808,7 @@
   function isCrushed() {}
-  if ( typeof isCrushed.name === 'string' && isCrushed.name !== 'isCrushed') {
+  if (typeof isCrushed.name === 'string' && isCrushed.name !== 'isCrushed') {
     warning$1('You are currently using minified code outside of NODE_ENV === "production". ' + 'This means that you are running a slower development build of Redux. ' + 'You can use loose-envify (https://github.com/zertosh/loose-envify) for browserify ' + 'or setting mode to production in webpack (https://webpack.js.org/concepts/mode/) ' + 'to ensure you have the correct code for your production build.');
   }
@@ -829,34 +830,34 @@
   });
   unwrapExports(reactIs_production_min);
-  var reactIs_production_min_1 = reactIs_production_min.typeOf;
-  var reactIs_production_min_2 = reactIs_production_min.AsyncMode;
-  var reactIs_production_min_3 = reactIs_production_min.ConcurrentMode;
-  var reactIs_production_min_4 = reactIs_production_min.ContextConsumer;
-  var reactIs_production_min_5 = reactIs_production_min.ContextProvider;
-  var reactIs_production_min_6 = reactIs_production_min.Element;
-  var reactIs_production_min_7 = reactIs_production_min.ForwardRef;
-  var reactIs_production_min_8 = reactIs_production_min.Fragment;
-  var reactIs_production_min_9 = reactIs_production_min.Lazy;
-  var reactIs_production_min_10 = reactIs_production_min.Memo;
-  var reactIs_production_min_11 = reactIs_production_min.Portal;
-  var reactIs_production_min_12 = reactIs_production_min.Profiler;
-  var reactIs_production_min_13 = reactIs_production_min.StrictMode;
-  var reactIs_production_min_14 = reactIs_production_min.Suspense;
-  var reactIs_production_min_15 = reactIs_production_min.isValidElementType;
-  var reactIs_production_min_16 = reactIs_production_min.isAsyncMode;
-  var reactIs_production_min_17 = reactIs_production_min.isConcurrentMode;
-  var reactIs_production_min_18 = reactIs_production_min.isContextConsumer;
-  var reactIs_production_min_19 = reactIs_production_min.isContextProvider;
-  var reactIs_production_min_20 = reactIs_production_min.isElement;
-  var reactIs_production_min_21 = reactIs_production_min.isForwardRef;
-  var reactIs_production_min_22 = reactIs_production_min.isFragment;
-  var reactIs_production_min_23 = reactIs_production_min.isLazy;
-  var reactIs_production_min_24 = reactIs_production_min.isMemo;
-  var reactIs_production_min_25 = reactIs_production_min.isPortal;
-  var reactIs_production_min_26 = reactIs_production_min.isProfiler;
-  var reactIs_production_min_27 = reactIs_production_min.isStrictMode;
-  var reactIs_production_min_28 = reactIs_production_min.isSuspense;
+  reactIs_production_min.typeOf;
+  reactIs_production_min.AsyncMode;
+  reactIs_production_min.ConcurrentMode;
+  reactIs_production_min.ContextConsumer;
+  reactIs_production_min.ContextProvider;
+  reactIs_production_min.Element;
+  reactIs_production_min.ForwardRef;
+  reactIs_production_min.Fragment;
+  reactIs_production_min.Lazy;
+  reactIs_production_min.Memo;
+  reactIs_production_min.Portal;
+  reactIs_production_min.Profiler;
+  reactIs_production_min.StrictMode;
+  reactIs_production_min.Suspense;
+  reactIs_production_min.isValidElementType;
+  reactIs_production_min.isAsyncMode;
+  reactIs_production_min.isConcurrentMode;
+  reactIs_production_min.isContextConsumer;
+  reactIs_production_min.isContextProvider;
+  reactIs_production_min.isElement;
+  reactIs_production_min.isForwardRef;
+  reactIs_production_min.isFragment;
+  reactIs_production_min.isLazy;
+  reactIs_production_min.isMemo;
+  reactIs_production_min.isPortal;
+  reactIs_production_min.isProfiler;
+  reactIs_production_min.isStrictMode;
+  reactIs_production_min.isSuspense;
   var reactIs_development = createCommonjsModule(function (module, exports) {
@@ -1087,34 +1088,34 @@
   });
   unwrapExports(reactIs_development);
-  var reactIs_development_1 = reactIs_development.typeOf;
-  var reactIs_development_2 = reactIs_development.AsyncMode;
-  var reactIs_development_3 = reactIs_development.ConcurrentMode;
-  var reactIs_development_4 = reactIs_development.ContextConsumer;
-  var reactIs_development_5 = reactIs_development.ContextProvider;
-  var reactIs_development_6 = reactIs_development.Element;
-  var reactIs_development_7 = reactIs_development.ForwardRef;
-  var reactIs_development_8 = reactIs_development.Fragment;
-  var reactIs_development_9 = reactIs_development.Lazy;
-  var reactIs_development_10 = reactIs_development.Memo;
-  var reactIs_development_11 = reactIs_development.Portal;
-  var reactIs_development_12 = reactIs_development.Profiler;
-  var reactIs_development_13 = reactIs_development.StrictMode;
-  var reactIs_development_14 = reactIs_development.Suspense;
-  var reactIs_development_15 = reactIs_development.isValidElementType;
-  var reactIs_development_16 = reactIs_development.isAsyncMode;
-  var reactIs_development_17 = reactIs_development.isConcurrentMode;
-  var reactIs_development_18 = reactIs_development.isContextConsumer;
-  var reactIs_development_19 = reactIs_development.isContextProvider;
-  var reactIs_development_20 = reactIs_development.isElement;
-  var reactIs_development_21 = reactIs_development.isForwardRef;
-  var reactIs_development_22 = reactIs_development.isFragment;
-  var reactIs_development_23 = reactIs_development.isLazy;
-  var reactIs_development_24 = reactIs_development.isMemo;
-  var reactIs_development_25 = reactIs_development.isPortal;
-  var reactIs_development_26 = reactIs_development.isProfiler;
-  var reactIs_development_27 = reactIs_development.isStrictMode;
-  var reactIs_development_28 = reactIs_development.isSuspense;
+  reactIs_development.typeOf;
+  reactIs_development.AsyncMode;
+  reactIs_development.ConcurrentMode;
+  reactIs_development.ContextConsumer;
+  reactIs_development.ContextProvider;
+  reactIs_development.Element;
+  reactIs_development.ForwardRef;
+  reactIs_development.Fragment;
+  reactIs_development.Lazy;
+  reactIs_development.Memo;
+  reactIs_development.Portal;
+  reactIs_development.Profiler;
+  reactIs_development.StrictMode;
+  reactIs_development.Suspense;
+  reactIs_development.isValidElementType;
+  reactIs_development.isAsyncMode;
+  reactIs_development.isConcurrentMode;
+  reactIs_development.isContextConsumer;
+  reactIs_development.isContextProvider;
+  reactIs_development.isElement;
+  reactIs_development.isForwardRef;
+  reactIs_development.isFragment;
+  reactIs_development.isLazy;
+  reactIs_development.isMemo;
+  reactIs_development.isPortal;
+  reactIs_development.isProfiler;
+  reactIs_development.isStrictMode;
+  reactIs_development.isSuspense;
   var reactIs = createCommonjsModule(function (module) {
@@ -1130,8 +1131,9 @@
   (c) Sindre Sorhus
   @license MIT
   */
   /* eslint-disable no-unused-vars */
-  var getOwnPropertySymbols = Object.getOwnPropertySymbols;
+  var getOwnPropertySymbols$1 = Object.getOwnPropertySymbols;
   var hasOwnProperty = Object.prototype.hasOwnProperty;
   var propIsEnumerable = Object.prototype.propertyIsEnumerable;
@@ -1201,8 +1203,8 @@
   			}
   		}
-  		if (getOwnPropertySymbols) {
-  			symbols = getOwnPropertySymbols(from);
+  		if (getOwnPropertySymbols$1) {
+  			symbols = getOwnPropertySymbols$1(from);
   			for (var i = 0; i < symbols.length; i++) {
   				if (propIsEnumerable.call(from, symbols[i])) {
   					to[symbols[i]] = from[symbols[i]];
@@ -1221,18 +1223,19 @@
    * LICENSE file in the root directory of this source tree.
    */
-  var ReactPropTypesSecret = 'SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED';
-  var ReactPropTypesSecret_1 = ReactPropTypesSecret;
+  var ReactPropTypesSecret$1 = 'SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED';
-  var printWarning = function() {};
+  var ReactPropTypesSecret_1 = ReactPropTypesSecret$1;
+  var printWarning$1 = function() {};
   {
-    var ReactPropTypesSecret$1 = ReactPropTypesSecret_1;
+    var ReactPropTypesSecret = ReactPropTypesSecret_1;
     var loggedTypeFailures = {};
-    var has = Function.call.bind(Object.prototype.hasOwnProperty);
+    var has$1 = Function.call.bind(Object.prototype.hasOwnProperty);
-    printWarning = function(text) {
+    printWarning$1 = function(text) {
       var message = 'Warning: ' + text;
       if (typeof console !== 'undefined') {
         console.error(message);
@@ -1260,7 +1263,7 @@
   function checkPropTypes(typeSpecs, values, location, componentName, getStack) {
     {
       for (var typeSpecName in typeSpecs) {
-        if (has(typeSpecs, typeSpecName)) {
+        if (has$1(typeSpecs, typeSpecName)) {
           var error;
           // Prop type validation may throw. In case they do, we don't want to
           // fail the render phase where it didn't fail before. So we log it.
@@ -1276,12 +1279,12 @@
               err.name = 'Invariant Violation';
               throw err;
             }
-            error = typeSpecs[typeSpecName](values, typeSpecName, componentName, location, null, ReactPropTypesSecret$1);
+            error = typeSpecs[typeSpecName](values, typeSpecName, componentName, location, null, ReactPropTypesSecret);
           } catch (ex) {
             error = ex;
           }
           if (error && !(error instanceof Error)) {
-            printWarning(
+            printWarning$1(
               (componentName || 'React class') + ': type specification of ' +
               location + ' `' + typeSpecName + '` is invalid; the type checker ' +
               'function must return `null` or an `Error` but returned a ' + typeof error + '. ' +
@@ -1297,7 +1300,7 @@
             var stack = getStack ? getStack() : '';
-            printWarning(
+            printWarning$1(
               'Failed ' + location + ' type: ' + error.message + (stack != null ? stack : '')
             );
           }
@@ -1319,11 +1322,11 @@
   var checkPropTypes_1 = checkPropTypes;
-  var has$1 = Function.call.bind(Object.prototype.hasOwnProperty);
-  var printWarning$1 = function() {};
+  var has = Function.call.bind(Object.prototype.hasOwnProperty);
+  var printWarning = function() {};
   {
-    printWarning$1 = function(text) {
+    printWarning = function(text) {
       var message = 'Warning: ' + text;
       if (typeof console !== 'undefined') {
         console.error(message);
@@ -1491,7 +1494,7 @@
             );
             err.name = 'Invariant Violation';
             throw err;
-          } else if ( typeof console !== 'undefined') {
+          } else if (typeof console !== 'undefined') {
             // Old behavior for people using React.PropTypes
             var cacheKey = componentName + ':' + propName;
             if (
@@ -1499,7 +1502,7 @@
               // Avoid spamming the console because they are often not actionable except for lib authors
               manualPropTypeWarningCount < 3
             ) {
-              printWarning$1(
+              printWarning(
                 'You are manually calling a React.PropTypes validation ' +
                 'function for the `' + propFullName + '` prop on `' + componentName  + '`. This is deprecated ' +
                 'and will throw in the standalone `prop-types` package. ' +
@@ -1612,12 +1615,12 @@
       if (!Array.isArray(expectedValues)) {
         {
           if (arguments.length > 1) {
-            printWarning$1(
+            printWarning(
               'Invalid arguments supplied to oneOf, expected an array, got ' + arguments.length + ' arguments. ' +
               'A common mistake is to write oneOf(x, y, z) instead of oneOf([x, y, z]).'
             );
           } else {
-            printWarning$1('Invalid argument supplied to oneOf, expected an array.');
+            printWarning('Invalid argument supplied to oneOf, expected an array.');
           }
         }
         return emptyFunctionThatReturnsNull;
@@ -1654,7 +1657,7 @@
           return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + propType + '` supplied to `' + componentName + '`, expected an object.'));
         }
         for (var key in propValue) {
-          if (has$1(propValue, key)) {
+          if (has(propValue, key)) {
             var error = typeChecker(propValue, key, componentName, location, propFullName + '.' + key, ReactPropTypesSecret_1);
             if (error instanceof Error) {
               return error;
@@ -1668,14 +1671,14 @@
     function createUnionTypeChecker(arrayOfTypeCheckers) {
       if (!Array.isArray(arrayOfTypeCheckers)) {
-         printWarning$1('Invalid argument supplied to oneOfType, expected an instance of array.') ;
+        printWarning('Invalid argument supplied to oneOfType, expected an instance of array.') ;
         return emptyFunctionThatReturnsNull;
       }
       for (var i = 0; i < arrayOfTypeCheckers.length; i++) {
         var checker = arrayOfTypeCheckers[i];
         if (typeof checker !== 'function') {
-          printWarning$1(
+          printWarning(
             'Invalid argument supplied to oneOfType. Expected an array of check functions, but ' +
             'received ' + getPostfixForTypeWarning(checker) + ' at index ' + i + '.'
           );
@@ -1916,7 +1919,7 @@
   var ReactReduxContext =
   /*#__PURE__*/
-  React__default.createContext(null);
+  React.createContext(null);
   {
     ReactReduxContext.displayName = 'ReactRedux';
@@ -2088,7 +2091,7 @@
       };
     }, [contextValue, previousState]);
     var Context = context || ReactReduxContext;
-    return React__default.createElement(Context.Provider, {
+    return React.createElement(Context.Provider, {
       value: contextValue
     }, children);
   }
@@ -2105,8 +2108,8 @@
     };
   }
-  function _extends$1() {
-    _extends$1 = Object.assign || function (target) {
+  function _extends() {
+    _extends = Object.assign || function (target) {
       for (var i = 1; i < arguments.length; i++) {
         var source = arguments[i];
@@ -2120,7 +2123,7 @@
       return target;
     };
-    return _extends$1.apply(this, arguments);
+    return _extends.apply(this, arguments);
   }
   function _objectWithoutPropertiesLoose(source, excluded) {
@@ -2195,7 +2198,7 @@
   var defineProperty = Object.defineProperty;
   var getOwnPropertyNames = Object.getOwnPropertyNames;
-  var getOwnPropertySymbols$1 = Object.getOwnPropertySymbols;
+  var getOwnPropertySymbols = Object.getOwnPropertySymbols;
   var getOwnPropertyDescriptor = Object.getOwnPropertyDescriptor;
   var getPrototypeOf = Object.getPrototypeOf;
   var objectPrototype = Object.prototype;
@@ -2212,8 +2215,8 @@
       var keys = getOwnPropertyNames(sourceComponent);
-      if (getOwnPropertySymbols$1) {
-        keys = keys.concat(getOwnPropertySymbols$1(sourceComponent));
+      if (getOwnPropertySymbols) {
+        keys = keys.concat(getOwnPropertySymbols(sourceComponent));
       }
       var targetStatics = getStatics(targetComponent);
@@ -2246,7 +2249,7 @@
   // is created synchronously, otherwise a store update may occur before the
   // subscription is created and an inconsistent state may be observed
-  var useIsomorphicLayoutEffect = typeof window !== 'undefined' && typeof window.document !== 'undefined' && typeof window.document.createElement !== 'undefined' ? React.useLayoutEffect : React.useEffect;
+  var useIsomorphicLayoutEffect$1 = typeof window !== 'undefined' && typeof window.document !== 'undefined' && typeof window.document.createElement !== 'undefined' ? React.useLayoutEffect : React.useEffect;
   var EMPTY_ARRAY = [];
   var NO_SUBSCRIPTION_ARRAY = [null, null];
@@ -2265,7 +2268,7 @@
   }
   function useIsomorphicLayoutEffectWithArgs(effectFunc, effectArgs, dependencies) {
-    useIsomorphicLayoutEffect(function () {
+    useIsomorphicLayoutEffect$1(function () {
       return effectFunc.apply(void 0, effectArgs);
     }, dependencies);
   }
@@ -2424,14 +2427,14 @@
     var Context = context;
     return function wrapWithConnect(WrappedComponent) {
-      if ( !reactIs_1(WrappedComponent)) {
+      if (!reactIs_1(WrappedComponent)) {
         throw new Error("You must pass a component to the function returned by " + (methodName + ". Instead received " + stringifyComponent(WrappedComponent)));
       }
       var wrappedComponentName = WrappedComponent.displayName || WrappedComponent.name || 'Component';
       var displayName = getDisplayName(wrappedComponentName);
-      var selectorFactoryOptions = _extends$1({}, connectOptions, {
+      var selectorFactoryOptions = _extends({}, connectOptions, {
         getDisplayName: getDisplayName,
         methodName: methodName,
         renderCountProp: renderCountProp,
@@ -2472,7 +2475,7 @@
         var ContextToUse = React.useMemo(function () {
           // Users may optionally pass in a custom context instance to use instead of our ReactReduxContext.
           // Memoize the check that determines which context instance we should use.
-          return propsContext && propsContext.Consumer && reactIs_2(React__default.createElement(propsContext.Consumer, null)) ? propsContext : Context;
+          return propsContext && propsContext.Consumer && reactIs_2(React.createElement(propsContext.Consumer, null)) ? propsContext : Context;
         }, [propsContext, Context]); // Retrieve the store and ancestor subscription via context, if available
         var contextValue = React.useContext(ContextToUse); // The store _must_ exist as either a prop or in context.
@@ -2482,7 +2485,7 @@
         var didStoreComeFromProps = Boolean(props.store) && Boolean(props.store.getState) && Boolean(props.store.dispatch);
         var didStoreComeFromContext = Boolean(contextValue) && Boolean(contextValue.store);
-        if ( !didStoreComeFromProps && !didStoreComeFromContext) {
+        if (!didStoreComeFromProps && !didStoreComeFromContext) {
           throw new Error("Could not find \"store\" in the context of " + ("\"" + displayName + "\". Either wrap the root component in a <Provider>, ") + "or pass a custom React context provider to <Provider> and the corresponding " + ("React context consumer to " + displayName + " in connect options."));
         } // Based on the previous check, one of these must be true
@@ -2521,7 +2524,7 @@
           // connected descendants won't update until after this component is done
-          return _extends$1({}, contextValue, {
+          return _extends({}, contextValue, {
             subscription: subscription
           });
         }, [didStoreComeFromProps, contextValue, subscription]); // We need to force this wrapper component to re-render whenever a Redux store update
@@ -2568,7 +2571,7 @@
         // We memoize the elements for the rendered child component as an optimization.
         var renderedWrappedComponent = React.useMemo(function () {
-          return React__default.createElement(WrappedComponent, _extends$1({}, actualChildProps, {
+          return React.createElement(WrappedComponent, _extends({}, actualChildProps, {
             ref: forwardedRef
           }));
         }, [forwardedRef, WrappedComponent, actualChildProps]); // If React sees the exact same element reference as last time, it bails out of re-rendering
@@ -2579,7 +2582,7 @@
             // If this component is subscribed to store updates, we need to pass its own
             // subscription instance down to our descendants. That means rendering the same
             // Context instance, and putting a different value into the context.
-            return React__default.createElement(ContextToUse.Provider, {
+            return React.createElement(ContextToUse.Provider, {
               value: overriddenContextValue
             }, renderedWrappedComponent);
           }
@@ -2590,13 +2593,13 @@
       } // If we're in "pure" mode, ensure our wrapper component only re-renders when incoming props have changed.
-      var Connect = pure ? React__default.memo(ConnectFunction) : ConnectFunction;
+      var Connect = pure ? React.memo(ConnectFunction) : ConnectFunction;
       Connect.WrappedComponent = WrappedComponent;
       Connect.displayName = displayName;
       if (forwardRef) {
-        var forwarded = React__default.forwardRef(function forwardConnectRef(props, ref) {
-          return React__default.createElement(Connect, _extends$1({}, props, {
+        var forwarded = React.forwardRef(function forwardConnectRef(props, ref) {
+          return React.createElement(Connect, _extends({}, props, {
             forwardedRef: ref
           }));
         });
@@ -2641,7 +2644,7 @@
    * @param {any} obj The object to inspect.
    * @returns {boolean} True if the argument appears to be a plain object.
    */
-  function isPlainObject$1(obj) {
+  function isPlainObject(obj) {
     if (typeof obj !== 'object' || obj === null) return false;
     var proto = Object.getPrototypeOf(obj);
     if (proto === null) return true;
@@ -2660,7 +2663,7 @@
    * @param {String} message The warning message.
    * @returns {void}
    */
-  function warning$2(message) {
+  function warning(message) {
     /* eslint-disable no-console */
     if (typeof console !== 'undefined' && typeof console.error === 'function') {
       console.error(message);
@@ -2680,8 +2683,8 @@
   }
   function verifyPlainObject(value, displayName, methodName) {
-    if (!isPlainObject$1(value)) {
-      warning$2(methodName + "() in " + displayName + " must return a plain object. Instead received " + value + ".");
+    if (!isPlainObject(value)) {
+      warning(methodName + "() in " + displayName + " must return a plain object. Instead received " + value + ".");
     }
   }
@@ -2777,7 +2780,7 @@
   var defaultMapStateToPropsFactories = [whenMapStateToPropsIsFunction, whenMapStateToPropsIsMissing];
   function defaultMergeProps(stateProps, dispatchProps, ownProps) {
-    return _extends$1({}, ownProps, {}, stateProps, {}, dispatchProps);
+    return _extends({}, ownProps, {}, stateProps, {}, dispatchProps);
   }
   function wrapMergePropsFunc(mergeProps) {
     return function initMergePropsProxy(dispatch, _ref) {
@@ -2816,7 +2819,7 @@
       throw new Error("Unexpected value for " + methodName + " in " + displayName + ".");
     } else if (methodName === 'mapStateToProps' || methodName === 'mapDispatchToProps') {
       if (!Object.prototype.hasOwnProperty.call(selector, 'dependsOnOwnProps')) {
-        warning$2("The selector for " + methodName + " of " + displayName + " did not specify a value for dependsOnOwnProps.");
+        warning("The selector for " + methodName + " of " + displayName + " did not specify a value for dependsOnOwnProps.");
       }
     }
   }
@@ -2981,7 +2984,7 @@
       var initMapStateToProps = match(mapStateToProps, mapStateToPropsFactories, 'mapStateToProps');
       var initMapDispatchToProps = match(mapDispatchToProps, mapDispatchToPropsFactories, 'mapDispatchToProps');
       var initMergeProps = match(mergeProps, mergePropsFactories, 'mergeProps');
-      return connectHOC(selectorFactory, _extends$1({
+      return connectHOC(selectorFactory, _extends({
         // used in error messages
         methodName: 'connect',
         // used to compute Connect's displayName from the wrapped component's displayName.
@@ -3007,7 +3010,7 @@
   setBatch(ReactDOM.unstable_batchedUpdates);
-  function areInputsEqual(newInputs, lastInputs) {
+  function areInputsEqual$1(newInputs, lastInputs) {
     if (newInputs.length !== lastInputs.length) {
       return false;
     }
@@ -3029,7 +3032,7 @@
       };
     })[0];
     var committed = React.useRef(initial);
-    var isInputMatch = Boolean(inputs && committed.current.inputs && areInputsEqual(inputs, committed.current.inputs));
+    var isInputMatch = Boolean(inputs && committed.current.inputs && areInputsEqual$1(inputs, committed.current.inputs));
     var cache = isInputMatch ? committed.current : {
       inputs: inputs,
       result: getResult()
@@ -3063,7 +3066,7 @@
       y: point1.y - point2.y
     };
   };
-  var isEqual = function isEqual(point1, point2) {
+  var isEqual$1 = function isEqual(point1, point2) {
     return point1.x === point2.x && point1.y === point2.y;
   };
   var negate = function negate(point) {
@@ -3084,7 +3087,7 @@
   var distance = function distance(point1, point2) {
     return Math.sqrt(Math.pow(point2.x - point1.x, 2) + Math.pow(point2.y - point1.y, 2));
   };
-  var closest = function closest(target, points) {
+  var closest$1 = function closest(target, points) {
     return Math.min.apply(Math, points.map(function (point) {
       return distance(target, point);
     }));
@@ -3098,11 +3101,15 @@
     };
   };
+  var isProduction = "development" === 'production';
   var prefix$1 = 'Invariant failed';
-  function invariant$1(condition, message) {
+  function invariant(condition, message) {
       if (condition) {
           return;
       }
+      if (isProduction) {
+          throw new Error(prefix$1);
+      }
       throw new Error(prefix$1 + ": " + (message || ''));
   }
@@ -3155,7 +3162,7 @@
     };
   };
-  var noSpacing = {
+  var noSpacing$1 = {
     top: 0,
     right: 0,
     bottom: 0,
@@ -3164,11 +3171,11 @@
   var createBox = function createBox(_ref2) {
     var borderBox = _ref2.borderBox,
         _ref2$margin = _ref2.margin,
-        margin = _ref2$margin === void 0 ? noSpacing : _ref2$margin,
+        margin = _ref2$margin === void 0 ? noSpacing$1 : _ref2$margin,
         _ref2$border = _ref2.border,
-        border = _ref2$border === void 0 ? noSpacing : _ref2$border,
+        border = _ref2$border === void 0 ? noSpacing$1 : _ref2$border,
         _ref2$padding = _ref2.padding,
-        padding = _ref2$padding === void 0 ? noSpacing : _ref2$padding;
+        padding = _ref2$padding === void 0 ? noSpacing$1 : _ref2$padding;
     var marginBox = getRect(expand(borderBox, margin));
     var paddingBox = getRect(shrink(borderBox, border));
     var contentBox = getRect(shrink(paddingBox, padding));
@@ -3192,11 +3199,11 @@
     }
     var result = Number(value);
-    !!isNaN(result) ?  invariant$1(false, "Could not parse value [raw: " + raw + ", without suffix: " + value + "]")  : void 0;
+    !!isNaN(result) ? invariant(false, "Could not parse value [raw: " + raw + ", without suffix: " + value + "]")  : void 0;
     return result;
   };
-  var getWindowScroll = function getWindowScroll() {
+  var getWindowScroll$1 = function getWindowScroll() {
     return {
       x: window.pageXOffset,
       y: window.pageYOffset
@@ -3218,7 +3225,7 @@
   };
   var withScroll = function withScroll(original, scroll) {
     if (scroll === void 0) {
-      scroll = getWindowScroll();
+      scroll = getWindowScroll$1();
     }
     return offset(original, scroll);
@@ -3293,14 +3300,14 @@
       y: spacing.bottom
     }];
   };
-  var noSpacing$1 = {
+  var noSpacing = {
     top: 0,
     right: 0,
     bottom: 0,
     left: 0
   };
-  var scroll = function scroll(target, frame) {
+  var scroll$1 = function scroll(target, frame) {
     if (!frame) {
       return target;
     }
@@ -3312,7 +3319,7 @@
     if (withPlaceholder && withPlaceholder.increasedBy) {
       var _extends2;
-      return _extends({}, target, (_extends2 = {}, _extends2[axis.end] = target[axis.end] + withPlaceholder.increasedBy[axis.line], _extends2));
+      return _extends$1({}, target, (_extends2 = {}, _extends2[axis.end] = target[axis.end] + withPlaceholder.increasedBy[axis.line], _extends2));
     }
     return target;
@@ -3331,7 +3338,7 @@
         withPlaceholder = _ref.withPlaceholder,
         axis = _ref.axis,
         frame = _ref.frame;
-    var scrolled = scroll(page.marginBox, frame);
+    var scrolled = scroll$1(page.marginBox, frame);
     var increased = increase(scrolled, axis, withPlaceholder);
     var clipped = clip(increased, frame);
     return {
@@ -3342,12 +3349,12 @@
   });
   var scrollDroppable = (function (droppable, newScroll) {
-    !droppable.frame ?  invariant(false)  : void 0;
+    !droppable.frame ? invariant$1(false)  : void 0;
     var scrollable = droppable.frame;
     var scrollDiff = subtract(newScroll, scrollable.scroll.initial);
     var scrollDisplacement = negate(scrollDiff);
-    var frame = _extends({}, scrollable, {
+    var frame = _extends$1({}, scrollable, {
       scroll: {
         initial: scrollable.scroll.initial,
         current: newScroll,
@@ -3366,7 +3373,7 @@
       frame: frame
     });
-    var result = _extends({}, droppable, {
+    var result = _extends$1({}, droppable, {
       frame: frame,
       subject: subject
     });
@@ -3374,7 +3381,7 @@
     return result;
   });
-  function areInputsEqual$1(newInputs, lastInputs) {
+  function areInputsEqual(newInputs, lastInputs) {
       if (newInputs.length !== lastInputs.length) {
           return false;
       }
@@ -3387,7 +3394,7 @@
   }
   function memoizeOne(resultFn, isEqual) {
-      if (isEqual === void 0) { isEqual = areInputsEqual$1; }
+      if (isEqual === void 0) { isEqual = areInputsEqual; }
       var lastThis;
       var lastArgs = [];
       var lastResult;
@@ -3529,7 +3536,7 @@
           droppableId: destination.descriptor.id
         }
       };
-      return _extends({}, previousImpact, {
+      return _extends$1({}, previousImpact, {
         at: at
       });
     }
@@ -3555,7 +3562,7 @@
     var indexOfClosest = findIndex(withoutDraggable, function (d) {
       return d.descriptor.id === closestId;
     });
-    !(indexOfClosest !== -1) ?  invariant(false, 'Could not find displaced item in set')  : void 0;
+    !(indexOfClosest !== -1) ? invariant$1(false, 'Could not find displaced item in set')  : void 0;
     var proposedIndex = indexOfClosest - 1;
     if (proposedIndex < 0) {
@@ -3584,6 +3591,7 @@
     displacedBy: noDisplacedBy,
     at: null
   };
+  var noImpact$1 = noImpact;
   var isWithin = (function (lowerBound, upperBound) {
     return function (value) {
@@ -3685,7 +3693,7 @@
     return isVisibleThroughFrameFn(viewport)(target);
   };
-  var isVisible = function isVisible(_ref) {
+  var isVisible$1 = function isVisible(_ref) {
     var toBeDisplaced = _ref.target,
         destination = _ref.destination,
         viewport = _ref.viewport,
@@ -3696,17 +3704,17 @@
   };
   var isPartiallyVisible = function isPartiallyVisible(args) {
-    return isVisible(_extends({}, args, {
+    return isVisible$1(_extends$1({}, args, {
       isVisibleThroughFrameFn: isPartiallyVisibleThroughFrame
     }));
   };
   var isTotallyVisible = function isTotallyVisible(args) {
-    return isVisible(_extends({}, args, {
+    return isVisible$1(_extends$1({}, args, {
       isVisibleThroughFrameFn: isTotallyVisibleThroughFrame
     }));
   };
   var isTotallyVisibleOnAxis = function isTotallyVisibleOnAxis(args) {
-    return isVisible(_extends({}, args, {
+    return isVisible$1(_extends$1({}, args, {
       isVisibleThroughFrameFn: isTotallyVisibleThroughFrameOnAxis(args.destination.axis)
     }));
   };
@@ -3939,7 +3947,7 @@
         viewport = _ref.viewport,
         afterCritical = _ref.afterCritical;
     var wasAt = previousImpact.at;
-    !wasAt ?  invariant(false, 'Cannot move in direction without previous impact location')  : void 0;
+    !wasAt ? invariant$1(false, 'Cannot move in direction without previous impact location')  : void 0;
     if (wasAt.type === 'REORDER') {
       var _newIndex = fromReorder({
@@ -4007,7 +4015,7 @@
         impact = _ref.impact,
         draggables = _ref.draggables;
     var combine = tryGetCombine(impact);
-    !combine ?  invariant(false)  : void 0;
+    !combine ? invariant$1(false)  : void 0;
     var combineWith = combine.draggableId;
     var center = draggables[combineWith].page.borderBox.center;
     var displaceBy = getCombinedItemDisplacement({
@@ -4188,7 +4196,7 @@
     return updated;
   });
-  function getDraggables(ids, draggables) {
+  function getDraggables$1(ids, draggables) {
     return ids.map(function (id) {
       return draggables[id];
     });
@@ -4216,7 +4224,7 @@
     var scrolledDroppable = destination.frame ? scrollDroppable(destination, add(destination.frame.scroll.current, maxScrollChange)) : destination;
     var last = impact.displaced;
     var withViewportScroll = getDisplacementGroups({
-      afterDragging: getDraggables(last.all, draggables),
+      afterDragging: getDraggables$1(last.all, draggables),
       destination: destination,
       displacedBy: impact.displacedBy,
       viewport: scrolledViewport.frame,
@@ -4224,7 +4232,7 @@
       forceShouldAnimate: false
     });
     var withDroppableScroll = getDisplacementGroups({
-      afterDragging: getDraggables(last.all, draggables),
+      afterDragging: getDraggables$1(last.all, draggables),
       destination: scrolledDroppable,
       displacedBy: impact.displacedBy,
       viewport: viewport.frame,
@@ -4245,7 +4253,7 @@
       invisible[id] = true;
     });
-    var newImpact = _extends({}, impact, {
+    var newImpact = _extends$1({}, impact, {
       displaced: {
         all: last.all,
         invisible: invisible,
@@ -4373,7 +4381,7 @@
   var getKnownActive = function getKnownActive(droppable) {
     var rect = droppable.subject.active;
-    !rect ?  invariant(false, 'Cannot get clipped area from droppable')  : void 0;
+    !rect ? invariant$1(false, 'Cannot get clipped area from droppable')  : void 0;
     return rect;
   };
@@ -4448,8 +4456,8 @@
     }
     return candidates.sort(function (a, b) {
-      var first = closest(pageBorderBoxCenter, getCorners(getKnownActive(a)));
-      var second = closest(pageBorderBoxCenter, getCorners(getKnownActive(b)));
+      var first = closest$1(pageBorderBoxCenter, getCorners(getKnownActive(a)));
+      var second = closest$1(pageBorderBoxCenter, getCorners(getKnownActive(b)));
       if (first !== second) {
         return first - second;
@@ -4529,8 +4537,8 @@
   };
   var withMaxScroll = function withMaxScroll(frame, max) {
-    return _extends({}, frame, {
-      scroll: _extends({}, frame.scroll, {
+    return _extends$1({}, frame, {
+      scroll: _extends$1({}, frame.scroll, {
         max: max
       })
     });
@@ -4538,8 +4546,8 @@
   var addPlaceholder = function addPlaceholder(droppable, draggable, draggables) {
     var frame = droppable.frame;
-    !!isHomeOf(draggable, droppable) ?  invariant(false, 'Should not add placeholder space to home list')  : void 0;
-    !!droppable.subject.withPlaceholder ?  invariant(false, 'Cannot add placeholder size to a subject when it already has one')  : void 0;
+    !!isHomeOf(draggable, droppable) ? invariant$1(false, 'Should not add placeholder space to home list')  : void 0;
+    !!droppable.subject.withPlaceholder ? invariant$1(false, 'Cannot add placeholder size to a subject when it already has one')  : void 0;
     var placeholderSize = getDisplacedBy(droppable.axis, draggable.displaceBy).point;
     var requiredGrowth = getRequiredGrowthForPlaceholder(droppable, placeholderSize, draggables);
     var added = {
@@ -4556,7 +4564,7 @@
         frame: droppable.frame
       });
-      return _extends({}, droppable, {
+      return _extends$1({}, droppable, {
         subject: _subject
       });
     }
@@ -4569,14 +4577,14 @@
       axis: droppable.axis,
       frame: newFrame
     });
-    return _extends({}, droppable, {
+    return _extends$1({}, droppable, {
       subject: subject,
       frame: newFrame
     });
   };
   var removePlaceholder = function removePlaceholder(droppable) {
     var added = droppable.subject.withPlaceholder;
-    !added ?  invariant(false, 'Cannot remove placeholder form subject when there was none')  : void 0;
+    !added ? invariant$1(false, 'Cannot remove placeholder form subject when there was none')  : void 0;
     var frame = droppable.frame;
     if (!frame) {
@@ -4587,13 +4595,13 @@
         withPlaceholder: null
       });
-      return _extends({}, droppable, {
+      return _extends$1({}, droppable, {
         subject: _subject2
       });
     }
     var oldMaxScroll = added.oldFrameMaxScroll;
-    !oldMaxScroll ?  invariant(false, 'Expected droppable with frame to have old max frame scroll when removing placeholder')  : void 0;
+    !oldMaxScroll ? invariant$1(false, 'Expected droppable with frame to have old max frame scroll when removing placeholder')  : void 0;
     var newFrame = withMaxScroll(frame, oldMaxScroll);
     var subject = getSubject({
       page: droppable.subject.page,
@@ -4601,7 +4609,7 @@
       frame: newFrame,
       withPlaceholder: null
     });
-    return _extends({}, droppable, {
+    return _extends$1({}, droppable, {
       subject: subject,
       frame: newFrame
     });
@@ -4757,7 +4765,7 @@
     return at.combine.droppableId;
   });
-  var getDroppableOver = function getDroppableOver(impact, droppables) {
+  var getDroppableOver$1 = function getDroppableOver(impact, droppables) {
     var id = whatIsDraggedOver(impact);
     return id ? droppables[id] : null;
   };
@@ -4765,7 +4773,7 @@
   var moveInDirection = (function (_ref) {
     var state = _ref.state,
         type = _ref.type;
-    var isActuallyOver = getDroppableOver(state.impact, state.dimensions.droppables);
+    var isActuallyOver = getDroppableOver$1(state.impact, state.dimensions.droppables);
     var isMainAxisMovementAllowed = Boolean(isActuallyOver);
     var home = state.dimensions.droppables[state.critical.droppable.id];
     var isOver = isActuallyOver || home;
@@ -4838,7 +4846,7 @@
     return sorted[0] ? sorted[0].id : null;
   }
-  function getDroppableOver$1(_ref2) {
+  function getDroppableOver(_ref2) {
     var pageBorderBox = _ref2.pageBorderBox,
         draggable = _ref2.draggable,
         droppables = _ref2.droppables;
@@ -5060,14 +5068,14 @@
         viewport = _ref.viewport,
         afterCritical = _ref.afterCritical;
     var pageBorderBox = offsetRectByPosition(draggable.page.borderBox, pageOffset);
-    var destinationId = getDroppableOver$1({
+    var destinationId = getDroppableOver({
       pageBorderBox: pageBorderBox,
       draggable: draggable,
       droppables: droppables
     });
     if (!destinationId) {
-      return noImpact;
+      return noImpact$1;
     }
     var destination = droppables[destinationId];
@@ -5094,7 +5102,7 @@
   var patchDroppableMap = (function (droppables, updated) {
     var _extends2;
-    return _extends({}, droppables, (_extends2 = {}, _extends2[updated.descriptor.id] = updated, _extends2));
+    return _extends$1({}, droppables, (_extends2 = {}, _extends2[updated.descriptor.id] = updated, _extends2));
   });
   var clearUnusedPlaceholder = function clearUnusedPlaceholder(_ref) {
@@ -5180,7 +5188,7 @@
     };
     if (state.phase === 'COLLECTING') {
-      return _extends({
+      return _extends$1({
         phase: 'COLLECTING'
       }, state, {
         dimensions: dimensions,
@@ -5207,7 +5215,7 @@
       droppables: dimensions.droppables
     });
-    var result = _extends({}, state, {
+    var result = _extends$1({}, state, {
       current: current,
       dimensions: {
         draggables: dimensions.draggables,
@@ -5222,7 +5230,7 @@
     return result;
   });
-  function getDraggables$1(ids, draggables) {
+  function getDraggables(ids, draggables) {
     return ids.map(function (id) {
       return draggables[id];
     });
@@ -5235,7 +5243,7 @@
         destination = _ref.destination,
         forceShouldAnimate = _ref.forceShouldAnimate;
     var last = impact.displaced;
-    var afterDragging = getDraggables$1(last.all, draggables);
+    var afterDragging = getDraggables(last.all, draggables);
     var displaced = getDisplacementGroups({
       afterDragging: afterDragging,
       destination: destination,
@@ -5244,7 +5252,7 @@
       forceShouldAnimate: forceShouldAnimate,
       last: last
     });
-    return _extends({}, impact, {
+    return _extends$1({}, impact, {
       displaced: displaced
     });
   });
@@ -5274,7 +5282,7 @@
     var state = _ref.state,
         forcedDimensions = _ref.dimensions,
         forcedViewport = _ref.viewport;
-    !(state.movementMode === 'SNAP') ?  invariant(false)  : void 0;
+    !(state.movementMode === 'SNAP') ? invariant$1(false)  : void 0;
     var needsVisibilityCheck = state.impact;
     var viewport = forcedViewport || state.viewport;
     var dimensions = forcedDimensions || state.dimensions;
@@ -5282,7 +5290,7 @@
         droppables = dimensions.droppables;
     var draggable = draggables[state.critical.draggable.id];
     var isOver = whatIsDraggedOver(needsVisibilityCheck);
-    !isOver ?  invariant(false, 'Must be over a destination in SNAP movement mode')  : void 0;
+    !isOver ? invariant$1(false, 'Must be over a destination in SNAP movement mode')  : void 0;
     var destination = droppables[isOver];
     var impact = recompute({
       impact: needsVisibilityCheck,
@@ -5322,7 +5330,7 @@
     var displacedBy = getDisplacedBy(home.axis, draggable.displaceBy);
     var insideHome = getDraggablesInsideDroppable(home.descriptor.id, draggables);
     var rawIndex = insideHome.indexOf(draggable);
-    !(rawIndex !== -1) ?  invariant(false, 'Expected draggable to be inside home list')  : void 0;
+    !(rawIndex !== -1) ? invariant$1(false, 'Expected draggable to be inside home list')  : void 0;
     var afterDragging = insideHome.slice(rawIndex + 1);
     var effected = afterDragging.reduce(function (previous, item) {
       previous[item.descriptor.id] = true;
@@ -5362,6 +5370,64 @@
     };
   });
+  var records = {};
+  var isEnabled = false;
+  var isTimingsEnabled = function isTimingsEnabled() {
+    return isEnabled;
+  };
+  var start = function start(key) {
+    {
+      if (!isTimingsEnabled()) {
+        return;
+      }
+      var now = performance.now();
+      records[key] = now;
+    }
+  };
+  var finish = function finish(key) {
+    {
+      if (!isTimingsEnabled()) {
+        return;
+      }
+      var now = performance.now();
+      var previous = records[key];
+      if (!previous) {
+        console.warn('cannot finish timing as no previous time found', key);
+        return;
+      }
+      var result = now - previous;
+      var rounded = result.toFixed(2);
+      var style = function () {
+        if (result < 12) {
+          return {
+            textColor: 'green',
+            symbol: '✅'
+          };
+        }
+        if (result < 40) {
+          return {
+            textColor: 'orange',
+            symbol: '⚠️'
+          };
+        }
+        return {
+          textColor: 'red',
+          symbol: '❌'
+        };
+      }();
+      console.log(style.symbol + " %cTiming %c" + rounded + " %cms %c" + key, 'color: blue; font-weight: bold;', "color: " + style.textColor + "; font-size: 1.1em;", 'color: grey;', 'color: purple; font-weight: bold;');
+    }
+  };
   var offsetDraggable = (function (_ref) {
     var draggable = _ref.draggable,
         offset$1 = _ref.offset,
@@ -5369,8 +5435,8 @@
     var client = offset(draggable.client, offset$1);
     var page = withScroll(client, initialWindowScroll);
-    var moved = _extends({}, draggable, {
-      placeholder: _extends({}, draggable.placeholder, {
+    var moved = _extends$1({}, draggable, {
+      placeholder: _extends$1({}, draggable.placeholder, {
         client: client
       }),
       client: client,
@@ -5382,7 +5448,7 @@
   var getFrame = (function (droppable) {
     var frame = droppable.frame;
-    !frame ?  invariant(false, 'Expected Droppable to have a frame')  : void 0;
+    !frame ? invariant$1(false, 'Expected Droppable to have a frame')  : void 0;
     return frame;
   });
@@ -5406,16 +5472,18 @@
     });
   });
+  var timingsKey = 'Processing dynamic changes';
   var publishWhileDraggingInVirtual = (function (_ref) {
     var state = _ref.state,
         published = _ref.published;
+    start(timingsKey);
     var withScrollChange = published.modified.map(function (update) {
       var existing = state.dimensions.droppables[update.droppableId];
       var scrolled = scrollDroppable(existing, update.scroll);
       return scrolled;
     });
-    var droppables = _extends({}, state.dimensions.droppables, {}, toDroppableMap(withScrollChange));
+    var droppables = _extends$1({}, state.dimensions.droppables, {}, toDroppableMap(withScrollChange));
     var updatedAdditions = toDraggableMap(adjustAdditionsForScrollChanges({
       additions: published.additions,
@@ -5423,7 +5491,7 @@
       viewport: state.viewport
     }));
-    var draggables = _extends({}, state.dimensions.draggables, {}, updatedAdditions);
+    var draggables = _extends$1({}, state.dimensions.draggables, {}, updatedAdditions);
     published.removals.forEach(function (id) {
       delete draggables[id];
@@ -5456,8 +5524,9 @@
       viewport: state.viewport,
       afterCritical: afterCritical
     });
+    finish(timingsKey);
-    var draggingState = _extends({
+    var draggingState = _extends$1({
       phase: 'DRAGGING'
     }, state, {
       phase: 'DRAGGING',
@@ -5472,7 +5541,7 @@
       return draggingState;
     }
-    var dropPending = _extends({
+    var dropPending = _extends$1({
       phase: 'DROP_PENDING'
     }, draggingState, {
       phase: 'DROP_PENDING',
@@ -5505,7 +5574,7 @@
   function removeScrollJumpRequest(state) {
     if (state.isDragging && state.movementMode === 'SNAP') {
-      return _extends({
+      return _extends$1({
         phase: 'DRAGGING'
       }, state, {
         scrollJumpRequest: null
@@ -5515,24 +5584,24 @@
     return state;
   }
-  var idle = {
+  var idle$2 = {
     phase: 'IDLE',
     completed: null,
     shouldFlush: false
   };
   var reducer = (function (state, action) {
     if (state === void 0) {
-      state = idle;
+      state = idle$2;
     }
     if (action.type === 'FLUSH') {
-      return _extends({}, idle, {
+      return _extends$1({}, idle$2, {
         shouldFlush: true
       });
     }
     if (action.type === 'INITIAL_PUBLISH') {
-      !(state.phase === 'IDLE') ?  invariant(false, 'INITIAL_PUBLISH must come after a IDLE phase')  : void 0;
+      !(state.phase === 'IDLE') ? invariant$1(false, 'INITIAL_PUBLISH must come after a IDLE phase')  : void 0;
       var _action$payload = action.payload,
           critical = _action$payload.critical,
           clientSelection = _action$payload.clientSelection,
@@ -5591,9 +5660,9 @@
         return state;
       }
-      !(state.phase === 'DRAGGING') ?  invariant(false, "Collection cannot start from phase " + state.phase)  : void 0;
+      !(state.phase === 'DRAGGING') ? invariant$1(false, "Collection cannot start from phase " + state.phase)  : void 0;
-      var _result = _extends({
+      var _result = _extends$1({
         phase: 'COLLECTING'
       }, state, {
         phase: 'COLLECTING'
@@ -5603,7 +5672,7 @@
     }
     if (action.type === 'PUBLISH_WHILE_DRAGGING') {
-      !(state.phase === 'COLLECTING' || state.phase === 'DROP_PENDING') ?  invariant(false, "Unexpected " + action.type + " received in phase " + state.phase)  : void 0;
+      !(state.phase === 'COLLECTING' || state.phase === 'DROP_PENDING') ? invariant$1(false, "Unexpected " + action.type + " received in phase " + state.phase)  : void 0;
       return publishWhileDraggingInVirtual({
         state: state,
         published: action.payload
@@ -5615,10 +5684,10 @@
         return state;
       }
-      !isMovementAllowed(state) ?  invariant(false, action.type + " not permitted in phase " + state.phase)  : void 0;
+      !isMovementAllowed(state) ? invariant$1(false, action.type + " not permitted in phase " + state.phase)  : void 0;
       var _clientSelection = action.payload.client;
-      if (isEqual(_clientSelection, state.current.client.selection)) {
+      if (isEqual$1(_clientSelection, state.current.client.selection)) {
         return state;
       }
@@ -5638,7 +5707,7 @@
         return removeScrollJumpRequest(state);
       }
-      !isMovementAllowed(state) ?  invariant(false, action.type + " not permitted in phase " + state.phase)  : void 0;
+      !isMovementAllowed(state) ? invariant$1(false, action.type + " not permitted in phase " + state.phase)  : void 0;
       var _action$payload2 = action.payload,
           id = _action$payload2.id,
           newScroll = _action$payload2.newScroll;
@@ -5657,15 +5726,15 @@
         return state;
       }
-      !isMovementAllowed(state) ?  invariant(false, "Attempting to move in an unsupported phase " + state.phase)  : void 0;
+      !isMovementAllowed(state) ? invariant$1(false, "Attempting to move in an unsupported phase " + state.phase)  : void 0;
       var _action$payload3 = action.payload,
           _id = _action$payload3.id,
           isEnabled = _action$payload3.isEnabled;
       var _target = state.dimensions.droppables[_id];
-      !_target ?  invariant(false, "Cannot find Droppable[id: " + _id + "] to toggle its enabled state")  : void 0;
-      !(_target.isEnabled !== isEnabled) ?  invariant(false, "Trying to set droppable isEnabled to " + String(isEnabled) + "\n      but it is already " + String(_target.isEnabled))  : void 0;
+      !_target ? invariant$1(false, "Cannot find Droppable[id: " + _id + "] to toggle its enabled state")  : void 0;
+      !(_target.isEnabled !== isEnabled) ? invariant$1(false, "Trying to set droppable isEnabled to " + String(isEnabled) + "\n      but it is already " + String(_target.isEnabled))  : void 0;
-      var updated = _extends({}, _target, {
+      var updated = _extends$1({}, _target, {
         isEnabled: isEnabled
       });
@@ -5677,15 +5746,15 @@
         return state;
       }
-      !isMovementAllowed(state) ?  invariant(false, "Attempting to move in an unsupported phase " + state.phase)  : void 0;
+      !isMovementAllowed(state) ? invariant$1(false, "Attempting to move in an unsupported phase " + state.phase)  : void 0;
       var _action$payload4 = action.payload,
           _id2 = _action$payload4.id,
           isCombineEnabled = _action$payload4.isCombineEnabled;
       var _target2 = state.dimensions.droppables[_id2];
-      !_target2 ?  invariant(false, "Cannot find Droppable[id: " + _id2 + "] to toggle its isCombineEnabled state")  : void 0;
-      !(_target2.isCombineEnabled !== isCombineEnabled) ?  invariant(false, "Trying to set droppable isCombineEnabled to " + String(isCombineEnabled) + "\n      but it is already " + String(_target2.isCombineEnabled))  : void 0;
+      !_target2 ? invariant$1(false, "Cannot find Droppable[id: " + _id2 + "] to toggle its isCombineEnabled state")  : void 0;
+      !(_target2.isCombineEnabled !== isCombineEnabled) ? invariant$1(false, "Trying to set droppable isCombineEnabled to " + String(isCombineEnabled) + "\n      but it is already " + String(_target2.isCombineEnabled))  : void 0;
-      var _updated = _extends({}, _target2, {
+      var _updated = _extends$1({}, _target2, {
         isCombineEnabled: isCombineEnabled
       });
@@ -5697,11 +5766,11 @@
         return state;
       }
-      !isMovementAllowed(state) ?  invariant(false, "Cannot move by window in phase " + state.phase)  : void 0;
-      !state.isWindowScrollAllowed ?  invariant(false, 'Window scrolling is currently not supported for fixed lists')  : void 0;
+      !isMovementAllowed(state) ? invariant$1(false, "Cannot move by window in phase " + state.phase)  : void 0;
+      !state.isWindowScrollAllowed ? invariant$1(false, 'Window scrolling is currently not supported for fixed lists')  : void 0;
       var _newScroll = action.payload.newScroll;
-      if (isEqual(state.viewport.scroll.current, _newScroll)) {
+      if (isEqual$1(state.viewport.scroll.current, _newScroll)) {
         return removeScrollJumpRequest(state);
       }
@@ -5727,17 +5796,17 @@
       var maxScroll = action.payload.maxScroll;
-      if (isEqual(maxScroll, state.viewport.scroll.max)) {
+      if (isEqual$1(maxScroll, state.viewport.scroll.max)) {
         return state;
       }
-      var withMaxScroll = _extends({}, state.viewport, {
-        scroll: _extends({}, state.viewport.scroll, {
+      var withMaxScroll = _extends$1({}, state.viewport, {
+        scroll: _extends$1({}, state.viewport.scroll, {
           max: maxScroll
         })
       });
-      return _extends({
+      return _extends$1({
         phase: 'DRAGGING'
       }, state, {
         viewport: withMaxScroll
@@ -5749,7 +5818,7 @@
         return state;
       }
-      !(state.phase === 'DRAGGING') ?  invariant(false, action.type + " received while not in DRAGGING phase")  : void 0;
+      !(state.phase === 'DRAGGING') ? invariant$1(false, action.type + " received while not in DRAGGING phase")  : void 0;
       var _result2 = moveInDirection({
         state: state,
@@ -5770,9 +5839,9 @@
     if (action.type === 'DROP_PENDING') {
       var reason = action.payload.reason;
-      !(state.phase === 'COLLECTING') ?  invariant(false, 'Can only move into the DROP_PENDING phase from the COLLECTING phase')  : void 0;
+      !(state.phase === 'COLLECTING') ? invariant$1(false, 'Can only move into the DROP_PENDING phase from the COLLECTING phase')  : void 0;
-      var newState = _extends({
+      var newState = _extends$1({
         phase: 'DROP_PENDING'
       }, state, {
         phase: 'DROP_PENDING',
@@ -5788,7 +5857,7 @@
           completed = _action$payload5.completed,
           dropDuration = _action$payload5.dropDuration,
           newHomeClientOffset = _action$payload5.newHomeClientOffset;
-      !(state.phase === 'DRAGGING' || state.phase === 'DROP_PENDING') ?  invariant(false, "Cannot animate drop from phase " + state.phase)  : void 0;
+      !(state.phase === 'DRAGGING' || state.phase === 'DROP_PENDING') ? invariant$1(false, "Cannot animate drop from phase " + state.phase)  : void 0;
       var _result3 = {
         phase: 'DROP_ANIMATING',
         completed: completed,
@@ -5817,7 +5886,7 @@
       payload: args
     };
   };
-  var lift = function lift(args) {
+  var lift$1 = function lift(args) {
     return {
       type: 'LIFT',
       payload: args
@@ -5919,7 +5988,7 @@
       payload: args
     };
   };
-  var drop = function drop(args) {
+  var drop$1 = function drop(args) {
     return {
       type: 'DROP',
       payload: args
@@ -5965,7 +6034,7 @@
       var hasError = Boolean(errors[index]);
       return hasError ? "[\uD83D\uDD25" + index + "]" : "" + index;
     }).join(', ');
-     warning("\n    Detected non-consecutive <Draggable /> indexes.\n\n    (This can cause unexpected bugs)\n\n    " + formatted + "\n  ") ;
+    warning$2("\n    Detected non-consecutive <Draggable /> indexes.\n\n    (This can cause unexpected bugs)\n\n    " + formatted + "\n  ") ;
   }
   function validateDimensions(critical, dimensions) {
@@ -5975,7 +6044,7 @@
     }
   }
-  var lift$1 = (function (marshal) {
+  var lift = (function (marshal) {
     return function (_ref) {
       var getState = _ref.getState,
           dispatch = _ref.dispatch;
@@ -5998,7 +6067,7 @@
             }));
           }
-          !(getState().phase === 'IDLE') ?  invariant(false, 'Unexpected phase to start a drag')  : void 0;
+          !(getState().phase === 'IDLE') ? invariant$1(false, 'Unexpected phase to start a drag')  : void 0;
           dispatch(flush());
           dispatch(beforeInitialCapture({
             draggableId: id,
@@ -6083,7 +6152,7 @@
   };
   var moveTo = function moveTo(offset) {
-    return isEqual(offset, origin) ? null : "translate(" + offset.x + "px, " + offset.y + "px)";
+    return isEqual$1(offset, origin) ? null : "translate(" + offset.x + "px, " + offset.y + "px)";
   };
   var transforms = {
@@ -6180,7 +6249,7 @@
       };
     }
-    var withoutMovement = _extends({}, lastImpact, {
+    var withoutMovement = _extends$1({}, lastImpact, {
       displaced: emptyGroups
     });
@@ -6190,7 +6259,7 @@
     };
   });
-  var drop$1 = (function (_ref) {
+  var drop = (function (_ref) {
     var getState = _ref.getState,
         dispatch = _ref.dispatch;
     return function (next) {
@@ -6215,8 +6284,8 @@
         }
         var isWaitingForDrop = state.phase === 'DROP_PENDING' && state.isWaiting;
-        !!isWaitingForDrop ?  invariant(false, 'A DROP action occurred while DROP_PENDING and still waiting')  : void 0;
-        !(state.phase === 'DRAGGING' || state.phase === 'DROP_PENDING') ?  invariant(false, "Cannot drop in phase: " + state.phase)  : void 0;
+        !!isWaitingForDrop ? invariant$1(false, 'A DROP action occurred while DROP_PENDING and still waiting')  : void 0;
+        !(state.phase === 'DRAGGING' || state.phase === 'DROP_PENDING') ? invariant$1(false, "Cannot drop in phase: " + state.phase)  : void 0;
         var critical = state.critical;
         var dimensions = state.dimensions;
         var draggable = dimensions.draggables[state.critical.draggable.id];
@@ -6261,7 +6330,7 @@
           result: result,
           impact: impact
         };
-        var isAnimationRequired = !isEqual(state.current.client.offset, newHomeClientOffset) || Boolean(result.combine);
+        var isAnimationRequired = !isEqual$1(state.current.client.offset, newHomeClientOffset) || Boolean(result.combine);
         if (!isAnimationRequired) {
           dispatch(completeDrop({
@@ -6318,7 +6387,9 @@
     return wrapperFn;
   };
-  var getWindowScroll$1 = (function () {
+  var rafSchedule = rafSchd;
+  var getWindowScroll = (function () {
     return {
       x: window.pageXOffset,
       y: window.pageYOffset
@@ -6346,27 +6417,27 @@
     var onWindowScroll = _ref.onWindowScroll;
     function updateScroll() {
-      onWindowScroll(getWindowScroll$1());
+      onWindowScroll(getWindowScroll());
     }
-    var scheduled = rafSchd(updateScroll);
+    var scheduled = rafSchedule(updateScroll);
     var binding = getWindowScrollBinding(scheduled);
-    var unbind = noop;
+    var unbind = noop$2;
     function isActive() {
-      return unbind !== noop;
+      return unbind !== noop$2;
     }
     function start() {
-      !!isActive() ?  invariant(false, 'Cannot start scroll listener when already active')  : void 0;
+      !!isActive() ? invariant$1(false, 'Cannot start scroll listener when already active')  : void 0;
       unbind = bindEvents(window, [binding]);
     }
     function stop() {
-      !isActive() ?  invariant(false, 'Cannot stop scroll listener when not active')  : void 0;
+      !isActive() ? invariant$1(false, 'Cannot stop scroll listener when not active')  : void 0;
       scheduled.cancel();
       unbind();
-      unbind = noop;
+      unbind = noop$2;
     }
     return {
@@ -6412,12 +6483,12 @@
     var result = function result(message) {
       if (wasCalled) {
-         warning('Announcement already made. Not making a second announcement') ;
+        warning$2('Announcement already made. Not making a second announcement') ;
         return;
       }
       if (isExpired) {
-         warning("\n        Announcements cannot be made asynchronously.\n        Default message has already been announced.\n      ") ;
+        warning$2("\n        Announcements cannot be made asynchronously.\n        Default message has already been announced.\n      ") ;
         return;
       }
@@ -6440,7 +6511,7 @@
       var index = findIndex(entries, function (item) {
         return item.timerId === timerId;
       });
-      !(index !== -1) ?  invariant(false, 'Could not find timer')  : void 0;
+      !(index !== -1) ? invariant$1(false, 'Could not find timer')  : void 0;
       var _entries$splice = entries.splice(index, 1),
           entry = _entries$splice[0];
@@ -6511,7 +6582,9 @@
   };
   var withTimings = function withTimings(key, fn) {
+    start(key);
     fn();
+    finish(key);
   };
   var getDragStart = function getDragStart(critical, mode) {
@@ -6548,7 +6621,7 @@
     var dragging = null;
     var beforeCapture = function beforeCapture(draggableId, mode) {
-      !!dragging ?  invariant(false, 'Cannot fire onBeforeCapture as a drag start has already been published')  : void 0;
+      !!dragging ? invariant$1(false, 'Cannot fire onBeforeCapture as a drag start has already been published')  : void 0;
       withTimings('onBeforeCapture', function () {
         var fn = getResponders().onBeforeCapture;
@@ -6563,7 +6636,7 @@
     };
     var beforeStart = function beforeStart(critical, mode) {
-      !!dragging ?  invariant(false, 'Cannot fire onBeforeDragStart as a drag start has already been published')  : void 0;
+      !!dragging ? invariant$1(false, 'Cannot fire onBeforeDragStart as a drag start has already been published')  : void 0;
       withTimings('onBeforeDragStart', function () {
         var fn = getResponders().onBeforeDragStart;
@@ -6574,7 +6647,7 @@
     };
     var start = function start(critical, mode) {
-      !!dragging ?  invariant(false, 'Cannot fire onBeforeDragStart as a drag start has already been published')  : void 0;
+      !!dragging ? invariant$1(false, 'Cannot fire onBeforeDragStart as a drag start has already been published')  : void 0;
       var data = getDragStart(critical, mode);
       dragging = {
         mode: mode,
@@ -6584,7 +6657,7 @@
       };
       asyncMarshal.add(function () {
         withTimings('onDragStart', function () {
-          return execute(getResponders().onDragStart, data, announce, preset.onDragStart);
+          return execute(getResponders().onDragStart, data, announce, preset$1.onDragStart);
         });
       });
     };
@@ -6592,7 +6665,7 @@
     var update = function update(critical, impact) {
       var location = tryGetDestination(impact);
       var combine = tryGetCombine(impact);
-      !dragging ?  invariant(false, 'Cannot fire onDragMove when onDragStart has not been called')  : void 0;
+      !dragging ? invariant$1(false, 'Cannot fire onDragMove when onDragStart has not been called')  : void 0;
       var hasCriticalChanged = !isCriticalEqual(critical, dragging.lastCritical);
       if (hasCriticalChanged) {
@@ -6615,28 +6688,28 @@
         return;
       }
-      var data = _extends({}, getDragStart(critical, dragging.mode), {
+      var data = _extends$1({}, getDragStart(critical, dragging.mode), {
         combine: combine,
         destination: location
       });
       asyncMarshal.add(function () {
         withTimings('onDragUpdate', function () {
-          return execute(getResponders().onDragUpdate, data, announce, preset.onDragUpdate);
+          return execute(getResponders().onDragUpdate, data, announce, preset$1.onDragUpdate);
         });
       });
     };
     var flush = function flush() {
-      !dragging ?  invariant(false, 'Can only flush responders while dragging')  : void 0;
+      !dragging ? invariant$1(false, 'Can only flush responders while dragging')  : void 0;
       asyncMarshal.flush();
     };
     var drop = function drop(result) {
-      !dragging ?  invariant(false, 'Cannot fire onDragEnd when there is no matching onDragStart')  : void 0;
+      !dragging ? invariant$1(false, 'Cannot fire onDragEnd when there is no matching onDragStart')  : void 0;
       dragging = null;
       withTimings('onDragEnd', function () {
-        return execute(getResponders().onDragEnd, result, announce, preset.onDragEnd);
+        return execute(getResponders().onDragEnd, result, announce, preset$1.onDragEnd);
       });
     };
@@ -6645,7 +6718,7 @@
         return;
       }
-      var result = _extends({}, getDragStart(dragging.lastCritical, dragging.mode), {
+      var result = _extends$1({}, getDragStart(dragging.lastCritical, dragging.mode), {
         combine: null,
         destination: null,
         reason: 'CANCEL'
@@ -6717,7 +6790,7 @@
         }
         var state = store.getState();
-        !(state.phase === 'DROP_ANIMATING') ?  invariant(false, 'Cannot finish a drop animating when no drop is occurring')  : void 0;
+        !(state.phase === 'DROP_ANIMATING') ? invariant$1(false, 'Cannot finish a drop animating when no drop is occurring')  : void 0;
         store.dispatch(completeDrop({
           completed: state.completed
         }));
@@ -6847,7 +6920,7 @@
           if (action.type === 'INITIAL_PUBLISH') {
             next(action);
             var state = store.getState();
-            !(state.phase === 'DRAGGING') ?  invariant(false, 'Expected phase to be DRAGGING after INITIAL_PUBLISH')  : void 0;
+            !(state.phase === 'DRAGGING') ? invariant$1(false, 'Expected phase to be DRAGGING after INITIAL_PUBLISH')  : void 0;
             autoScroller.start(state);
             return;
           }
@@ -6878,24 +6951,24 @@
           return;
         }
-        store.dispatch(drop({
+        store.dispatch(drop$1({
           reason: postActionState.reason
         }));
       };
     };
   });
-  var composeEnhancers =  typeof window !== 'undefined' && window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ ? window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({
+  var composeEnhancers = typeof window !== 'undefined' && window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ ? window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({
     name: 'react-beautiful-dnd'
   }) : compose;
-  var createStore$1 = (function (_ref) {
+  var createStore = (function (_ref) {
     var dimensionMarshal = _ref.dimensionMarshal,
         focusMarshal = _ref.focusMarshal,
         styleMarshal = _ref.styleMarshal,
         getResponders = _ref.getResponders,
         announce = _ref.announce,
         autoScroller = _ref.autoScroller;
-    return createStore(reducer, composeEnhancers(applyMiddleware(style(styleMarshal), dimensionMarshalStopper(dimensionMarshal), lift$1(dimensionMarshal), drop$1, dropAnimationFinish, dropAnimationFlushOnScroll, pendingDrop, autoScroll(autoScroller), scrollListener, focus(focusMarshal), responders(getResponders, announce))));
+    return createStore$1(reducer, composeEnhancers(applyMiddleware(style(styleMarshal), dimensionMarshalStopper(dimensionMarshal), lift(dimensionMarshal), drop, dropAnimationFinish, dropAnimationFlushOnScroll, pendingDrop, autoScroll(autoScroller), scrollListener, focus(focusMarshal), responders(getResponders, announce))));
   });
   var clean$1 = function clean() {
@@ -6905,6 +6978,8 @@
       modified: {}
     };
   };
+  var timingKey = 'Publish collection from DOM';
   function createPublisher(_ref) {
     var registry = _ref.registry,
         callbacks = _ref.callbacks;
@@ -6919,6 +6994,7 @@
       callbacks.collectionStarting();
       frameId = requestAnimationFrame(function () {
         frameId = null;
+        start(timingKey);
         var _staging = staging,
             additions = _staging.additions,
             removals = _staging.removals,
@@ -6942,6 +7018,7 @@
           modified: updated
         };
         staging = clean$1();
+        finish(timingKey);
         callbacks.publish(result);
       });
     };
@@ -7008,7 +7085,7 @@
   var getDocumentElement = (function () {
     var doc = document.documentElement;
-    !doc ?  invariant(false, 'Cannot find document.documentElement')  : void 0;
+    !doc ? invariant$1(false, 'Cannot find document.documentElement')  : void 0;
     return doc;
   });
@@ -7024,7 +7101,7 @@
   });
   var getViewport = (function () {
-    var scroll = getWindowScroll$1();
+    var scroll = getWindowScroll();
     var maxScroll = getMaxWindowScroll();
     var top = scroll.y;
     var left = scroll.x;
@@ -7058,6 +7135,8 @@
     var critical = _ref.critical,
         scrollOptions = _ref.scrollOptions,
         registry = _ref.registry;
+    var timingKey = 'Initial collection from DOM';
+    start(timingKey);
     var viewport = getViewport();
     var windowScroll = viewport.scroll.current;
     var home = critical.droppable;
@@ -7071,6 +7150,7 @@
       draggables: toDraggableMap(draggables),
       droppables: toDroppableMap(droppables)
     };
+    finish(timingKey);
     var result = {
       dimensions: dimensions,
       critical: critical,
@@ -7091,7 +7171,7 @@
     var home = registry.droppable.getById(entry.descriptor.droppableId);
     if (home.descriptor.mode !== 'virtual') {
-       warning("\n      You are attempting to add or remove a Draggable [id: " + entry.descriptor.id + "]\n      while a drag is occurring. This is only supported for virtual lists.\n\n      See https://github.com/atlassian/react-beautiful-dnd/blob/master/docs/patterns/virtual-lists.md\n    ") ;
+      warning$2("\n      You are attempting to add or remove a Draggable [id: " + entry.descriptor.id + "]\n      while a drag is occurring. This is only supported for virtual lists.\n\n      See https://github.com/atlassian/react-beautiful-dnd/blob/master/docs/patterns/virtual-lists.md\n    ") ;
       return false;
     }
@@ -7109,7 +7189,7 @@
     });
     var updateDroppableIsEnabled = function updateDroppableIsEnabled(id, isEnabled) {
-      !registry.droppable.exists(id) ?  invariant(false, "Cannot update is enabled flag of Droppable " + id + " as it is not registered")  : void 0;
+      !registry.droppable.exists(id) ? invariant$1(false, "Cannot update is enabled flag of Droppable " + id + " as it is not registered")  : void 0;
       if (!collection) {
         return;
@@ -7126,7 +7206,7 @@
         return;
       }
-      !registry.droppable.exists(id) ?  invariant(false, "Cannot update isCombineEnabled flag of Droppable " + id + " as it is not registered")  : void 0;
+      !registry.droppable.exists(id) ? invariant$1(false, "Cannot update isCombineEnabled flag of Droppable " + id + " as it is not registered")  : void 0;
       callbacks.updateDroppableIsCombineEnabled({
         id: id,
         isCombineEnabled: isCombineEnabled
@@ -7138,7 +7218,7 @@
         return;
       }
-      !registry.droppable.exists(id) ?  invariant(false, "Cannot update the scroll on Droppable " + id + " as it is not registered")  : void 0;
+      !registry.droppable.exists(id) ? invariant$1(false, "Cannot update the scroll on Droppable " + id + " as it is not registered")  : void 0;
       callbacks.updateDroppableScroll({
         id: id,
         newScroll: newScroll
@@ -7168,7 +7248,7 @@
     };
     var subscriber = function subscriber(event) {
-      !collection ?  invariant(false, 'Should only be subscribed when a collection is occurring')  : void 0;
+      !collection ? invariant$1(false, 'Should only be subscribed when a collection is occurring')  : void 0;
       var dragging = collection.critical.draggable;
       if (event.type === 'ADDITION') {
@@ -7185,7 +7265,7 @@
     };
     var startPublishing = function startPublishing(request) {
-      !!collection ?  invariant(false, 'Cannot start capturing critical dimensions as there is already a collection')  : void 0;
+      !!collection ? invariant$1(false, 'Cannot start capturing critical dimensions as there is already a collection')  : void 0;
       var entry = registry.draggable.getById(request.draggableId);
       var home = registry.droppable.getById(entry.descriptor.droppableId);
       var critical = {
@@ -7251,7 +7331,7 @@
   var getScrollableDroppableOver = function getScrollableDroppableOver(target, droppables) {
     var maybe = find(getScrollableDroppables(droppables), function (droppable) {
-      !droppable.frame ?  invariant(false, 'Invalid result')  : void 0;
+      !droppable.frame ? invariant$1(false, 'Invalid result')  : void 0;
       return isPositionInFrame(droppable.frame.pageMarginBox)(target);
     });
     return maybe;
@@ -7283,7 +7363,7 @@
     var range = endOfRange - startOfRange;
     if (range === 0) {
-       warning("\n      Detected distance range of 0 in the fluid auto scroller\n      This is unexpected and would cause a divide by 0 issue.\n      Not allowing an auto scroll\n    ") ;
+      warning$2("\n      Detected distance range of 0 in the fluid auto scroller\n      This is unexpected and would cause a divide by 0 issue.\n      Not allowing an auto scroll\n    ") ;
       return 0;
     }
@@ -7304,6 +7384,7 @@
       accelerateAt: 360
     }
   };
+  var config$1 = config;
   var minScroll = 1;
@@ -7312,7 +7393,7 @@
       return 0;
     }
-    var maxSpeed = (configOverride == null ? void 0 : configOverride.maxPixelScroll) || config.maxPixelScroll;
+    var maxSpeed = (configOverride == null ? void 0 : configOverride.maxPixelScroll) || config$1.maxPixelScroll;
     if (distanceToEdge <= thresholds.maxScrollValueAt) {
       return maxSpeed;
@@ -7328,18 +7409,18 @@
       current: distanceToEdge
     });
     var percentageFromStartScrollingFrom = 1 - percentageFromMaxScrollValueAt;
-    var scroll = maxSpeed * config.ease(percentageFromStartScrollingFrom);
+    var scroll = maxSpeed * config$1.ease(percentageFromStartScrollingFrom);
     return Math.ceil(scroll);
   });
-  var defaultAccelerateAt = config.durationDampening.accelerateAt;
-  var defaultStopAt = config.durationDampening.stopDampeningAt;
+  var defaultAccelerateAt = config$1.durationDampening.accelerateAt;
+  var defaultStopAt = config$1.durationDampening.stopDampeningAt;
   var dampenValueByTime = (function (proposedScroll, dragStartTime, configOverride) {
     var _configOverride$durat, _configOverride$durat2;
     var accelerateAt = (configOverride == null ? void 0 : (_configOverride$durat = configOverride.durationDampening) == null ? void 0 : _configOverride$durat.accelerateAt) || defaultAccelerateAt;
     var stopAt = (configOverride == null ? void 0 : (_configOverride$durat2 = configOverride.durationDampening) == null ? void 0 : _configOverride$durat2.stopDampeningAt) || defaultStopAt;
-    var ease = (configOverride == null ? void 0 : configOverride.ease) || config.ease;
+    var ease = (configOverride == null ? void 0 : configOverride.ease) || config$1.ease;
     var startOfRange = dragStartTime;
     var endOfRange = stopAt;
     var now = Date.now();
@@ -7546,8 +7627,8 @@
   });
   var getDistanceThresholds = (function (container, axis, configOverride) {
-    var startFromPercentage = (configOverride == null ? void 0 : configOverride.startFromPercentage) || config.startFromPercentage;
-    var maxScrollAtPercentage = (configOverride == null ? void 0 : configOverride.maxScrollAtPercentage) || config.maxScrollAtPercentage;
+    var startFromPercentage = (configOverride == null ? void 0 : configOverride.startFromPercentage) || config$1.startFromPercentage;
+    var maxScrollAtPercentage = (configOverride == null ? void 0 : configOverride.maxScrollAtPercentage) || config$1.maxScrollAtPercentage;
     var startScrollingFrom = container[axis.size] * startFromPercentage;
     var maxScrollValueAt = container[axis.size] * maxScrollAtPercentage;
     var thresholds = {
@@ -7557,10 +7638,10 @@
     return thresholds;
   });
-  var clean$2 = apply(function (value) {
+  var clean = apply(function (value) {
     return value === 0 ? 0 : value;
   });
-  var getScroll = (function (_ref) {
+  var getScroll$1 = (function (_ref) {
     var dragStartTime = _ref.dragStartTime,
         container = _ref.container,
         containerScroll = _ref.containerScroll,
@@ -7595,12 +7676,12 @@
       shouldUseTimeDampening: shouldUseTimeDampening,
       thresholds: thresholdsHorizontal
     });
-    var required = clean$2({
+    var required = clean({
       x: x,
       y: y
     });
-    if (isEqual(required, origin)) {
+    if (isEqual$1(required, origin)) {
       return null;
     }
@@ -7647,7 +7728,7 @@
       }
     }
-    return isEqual(scroll, origin) ? null : scroll;
+    return isEqual$1(scroll, origin) ? null : scroll;
   });
   var smallestSigned = apply(function (value) {
@@ -7680,7 +7761,7 @@
         y: getRemainder(targetScroll.y, max.y)
       };
-      if (isEqual(overlap, origin)) {
+      if (isEqual$1(overlap, origin)) {
         return null;
       }
@@ -7779,7 +7860,7 @@
       x: viewport.scroll.current.x,
       y: viewport.scroll.current.y
     };
-    var scroll = getScroll({
+    var scroll = getScroll$1({
       dragStartTime: dragStartTime,
       container: viewport.frame,
       containerScroll: viewport.scroll,
@@ -7807,7 +7888,7 @@
       return null;
     }
-    var scroll = getScroll({
+    var scroll = getScroll$1({
       dragStartTime: dragStartTime,
       container: frame.pageMarginBox,
       containerScroll: frame.scroll,
@@ -7820,7 +7901,7 @@
     return scroll && canScrollDroppable(droppable, scroll) ? scroll : null;
   });
-  var scroll$1 = (function (_ref) {
+  var scroll = (function (_ref) {
     var state = _ref.state,
         dragStartTime = _ref.dragStartTime,
         shouldUseTimeDampening = _ref.shouldUseTimeDampening,
@@ -7880,16 +7961,16 @@
     var scrollWindow = _ref.scrollWindow,
         scrollDroppable = _ref.scrollDroppable,
         fluidScrollerOptions = _ref.fluidScrollerOptions;
-    var scheduleWindowScroll = rafSchd(scrollWindow);
-    var scheduleDroppableScroll = rafSchd(scrollDroppable);
+    var scheduleWindowScroll = rafSchedule(scrollWindow);
+    var scheduleDroppableScroll = rafSchedule(scrollDroppable);
     var dragging = null;
     var tryScroll = function tryScroll(state) {
-      !dragging ?  invariant(false, 'Cannot fluid scroll if not dragging')  : void 0;
+      !dragging ? invariant$1(false, 'Cannot fluid scroll if not dragging')  : void 0;
       var _dragging = dragging,
           shouldUseTimeDampening = _dragging.shouldUseTimeDampening,
           dragStartTime = _dragging.dragStartTime;
-      scroll$1({
+      scroll({
         state: state,
         scrollWindow: scheduleWindowScroll,
         scrollDroppable: scheduleDroppableScroll,
@@ -7899,8 +7980,9 @@
       });
     };
-    var start = function start(state) {
-      !!dragging ?  invariant(false, 'Cannot start auto scrolling when already started')  : void 0;
+    var start$1 = function start$1(state) {
+      start('starting fluid scroller');
+      !!dragging ? invariant$1(false, 'Cannot start auto scrolling when already started')  : void 0;
       var dragStartTime = Date.now();
       var wasScrollNeeded = false;
@@ -7908,7 +7990,7 @@
         wasScrollNeeded = true;
       };
-      scroll$1({
+      scroll({
         state: state,
         dragStartTime: 0,
         shouldUseTimeDampening: false,
@@ -7920,6 +8002,7 @@
         dragStartTime: dragStartTime,
         shouldUseTimeDampening: wasScrollNeeded
       };
+      finish('starting fluid scroller');
       if (wasScrollNeeded) {
         tryScroll(state);
@@ -7937,7 +8020,7 @@
     };
     return {
-      start: start,
+      start: start$1,
       stop: stop,
       scroll: tryScroll
     };
@@ -8003,7 +8086,7 @@
       }
       var destination = whatIsDraggedOver(state.impact);
-      !destination ?  invariant(false, 'Cannot perform a jump scroll when there is no destination')  : void 0;
+      !destination ? invariant$1(false, 'Cannot perform a jump scroll when there is no destination')  : void 0;
       var droppableRemainder = scrollDroppableAsMuchAsItCan(state.dimensions.droppables[destination], request);
       if (!droppableRemainder) {
@@ -8064,9 +8147,9 @@
     return scroller;
   });
-  var prefix$2 = 'data-rbd';
+  var prefix = 'data-rbd';
   var dragHandle = function () {
-    var base = prefix$2 + "-drag-handle";
+    var base = prefix + "-drag-handle";
     return {
       base: base,
       draggableId: base + "-draggable-id",
@@ -8074,7 +8157,7 @@
     };
   }();
   var draggable = function () {
-    var base = prefix$2 + "-draggable";
+    var base = prefix + "-draggable";
     return {
       base: base,
       contextId: base + "-context-id",
@@ -8082,7 +8165,7 @@
     };
   }();
   var droppable = function () {
-    var base = prefix$2 + "-droppable";
+    var base = prefix + "-droppable";
     return {
       base: base,
       contextId: base + "-context-id",
@@ -8090,7 +8173,7 @@
     };
   }();
   var scrollContainer = {
-    contextId: prefix$2 + "-scroll-container-context-id"
+    contextId: prefix + "-scroll-container-context-id"
   };
   var makeGetSelector = function makeGetSelector(context) {
@@ -8162,11 +8245,12 @@
     };
   });
-  var useIsomorphicLayoutEffect$1 = typeof window !== 'undefined' && typeof window.document !== 'undefined' && typeof window.document.createElement !== 'undefined' ? React.useLayoutEffect : React.useEffect;
+  var useIsomorphicLayoutEffect = typeof window !== 'undefined' && typeof window.document !== 'undefined' && typeof window.document.createElement !== 'undefined' ? React.useLayoutEffect : React.useEffect;
+  var useLayoutEffect = useIsomorphicLayoutEffect;
   var getHead = function getHead() {
     var head = document.querySelector('head');
-    !head ?  invariant(false, 'Cannot find the head to append a style to')  : void 0;
+    !head ? invariant$1(false, 'Cannot find the head to append a style to')  : void 0;
     return head;
   };
@@ -8189,22 +8273,22 @@
     var dynamicRef = React.useRef(null);
     var setDynamicStyle = useCallback(memoizeOne(function (proposed) {
       var el = dynamicRef.current;
-      !el ?  invariant(false, 'Cannot set dynamic style element if it is not set')  : void 0;
+      !el ? invariant$1(false, 'Cannot set dynamic style element if it is not set')  : void 0;
       el.textContent = proposed;
     }), []);
     var setAlwaysStyle = useCallback(function (proposed) {
       var el = alwaysRef.current;
-      !el ?  invariant(false, 'Cannot set dynamic style element if it is not set')  : void 0;
+      !el ? invariant$1(false, 'Cannot set dynamic style element if it is not set')  : void 0;
       el.textContent = proposed;
     }, []);
-    useIsomorphicLayoutEffect$1(function () {
-      !(!alwaysRef.current && !dynamicRef.current) ?  invariant(false, 'style elements already mounted')  : void 0;
+    useLayoutEffect(function () {
+      !(!alwaysRef.current && !dynamicRef.current) ? invariant$1(false, 'style elements already mounted')  : void 0;
       var always = createStyleEl(nonce);
       var dynamic = createStyleEl(nonce);
       alwaysRef.current = always;
       dynamicRef.current = dynamic;
-      always.setAttribute(prefix$2 + "-always", contextId);
-      dynamic.setAttribute(prefix$2 + "-dynamic", contextId);
+      always.setAttribute(prefix + "-always", contextId);
+      dynamic.setAttribute(prefix + "-dynamic", contextId);
       getHead().appendChild(always);
       getHead().appendChild(dynamic);
       setAlwaysStyle(styles.always);
@@ -8212,7 +8296,7 @@
       return function () {
         var remove = function remove(ref) {
           var current = ref.current;
-          !current ?  invariant(false, 'Cannot unmount ref as it is not set')  : void 0;
+          !current ? invariant$1(false, 'Cannot unmount ref as it is not set')  : void 0;
           getHead().removeChild(current);
           ref.current = null;
         };
@@ -8262,7 +8346,7 @@
     var possible = toArray(document.querySelectorAll(selector));
     if (!possible.length) {
-       warning("Unable to find any drag handles in the context \"" + contextId + "\"") ;
+      warning$2("Unable to find any drag handles in the context \"" + contextId + "\"") ;
       return null;
     }
@@ -8271,12 +8355,12 @@
     });
     if (!handle) {
-       warning("Unable to find drag handle with id \"" + draggableId + "\" as no handle with a matching id was found") ;
+      warning$2("Unable to find drag handle with id \"" + draggableId + "\" as no handle with a matching id was found") ;
       return null;
     }
     if (!isHtmlElement(handle)) {
-       warning('drag handle needs to be a HTMLElement') ;
+      warning$2('drag handle needs to be a HTMLElement') ;
       return null;
     }
@@ -8347,7 +8431,7 @@
       recordRef.current = id;
     }, []);
-    useIsomorphicLayoutEffect$1(function () {
+    useLayoutEffect(function () {
       isMountedRef.current = true;
       return function clearFrameOnUnmount() {
         isMountedRef.current = false;
@@ -8403,7 +8487,7 @@
     function getDraggableById(id) {
       var entry = findDraggableById(id);
-      !entry ?  invariant(false, "Cannot find draggable entry with id [" + id + "]")  : void 0;
+      !entry ? invariant$1(false, "Cannot find draggable entry with id [" + id + "]")  : void 0;
       return entry;
     }
@@ -8465,7 +8549,7 @@
     function getDroppableById(id) {
       var entry = findDroppableById(id);
-      !entry ?  invariant(false, "Cannot find droppable entry with id [" + id + "]")  : void 0;
+      !entry ? invariant$1(false, "Cannot find droppable entry with id [" + id + "]")  : void 0;
       return entry;
     }
@@ -8522,11 +8606,11 @@
     return registry;
   }
-  var StoreContext = React__default.createContext(null);
+  var StoreContext = React.createContext(null);
   var getBodyElement = (function () {
     var body = document.body;
-    !body ?  invariant(false, 'Cannot find document.body')  : void 0;
+    !body ? invariant$1(false, 'Cannot find document.body')  : void 0;
     return body;
   });
@@ -8541,6 +8625,7 @@
     clip: 'rect(0 0 0 0)',
     'clip-path': 'inset(100%)'
   };
+  var visuallyHidden$1 = visuallyHidden;
   var getId = function getId(contextId) {
     return "rbd-announcement-" + contextId;
@@ -8557,7 +8642,7 @@
       el.setAttribute('aria-live', 'assertive');
       el.setAttribute('aria-atomic', 'true');
-      _extends(el.style, visuallyHidden);
+      _extends$1(el.style, visuallyHidden$1);
       getBodyElement().appendChild(el);
       return function cleanup() {
@@ -8582,17 +8667,17 @@
         return;
       }
-       warning("\n      A screen reader message was trying to be announced but it was unable to do so.\n      This can occur if you unmount your <DragDropContext /> in your onDragEnd.\n      Consider calling provided.announce() before the unmount so that the instruction will\n      not be lost for users relying on a screen reader.\n\n      Message not passed to screen reader:\n\n      \"" + message + "\"\n    ") ;
+      warning$2("\n      A screen reader message was trying to be announced but it was unable to do so.\n      This can occur if you unmount your <DragDropContext /> in your onDragEnd.\n      Consider calling provided.announce() before the unmount so that the instruction will\n      not be lost for users relying on a screen reader.\n\n      Message not passed to screen reader:\n\n      \"" + message + "\"\n    ") ;
     }, []);
     return announce;
   }
-  var count = 0;
+  var count$1 = 0;
   var defaults = {
     separator: '::'
   };
-  function reset() {
-    count = 0;
+  function reset$1() {
+    count$1 = 0;
   }
   function useUniqueId(prefix, options) {
     if (options === void 0) {
@@ -8600,7 +8685,7 @@
     }
     return useMemo(function () {
-      return "" + prefix + options.separator + count++;
+      return "" + prefix + options.separator + count$1++;
     }, [options.separator, prefix]);
   }
@@ -8638,7 +8723,7 @@
     return id;
   }
-  var AppContext = React__default.createContext(null);
+  var AppContext = React.createContext(null);
   var peerDependencies = {
   	react: "^16.8.5 || ^17.0.0 || ^18.0.0",
@@ -8649,7 +8734,7 @@
   var getVersion = function getVersion(value) {
     var result = semver.exec(value);
-    !(result != null) ?  invariant(false, "Unable to parse React version " + value)  : void 0;
+    !(result != null) ? invariant$1(false, "Unable to parse React version " + value)  : void 0;
     var major = Number(result[1]);
     var minor = Number(result[2]);
     var patch = Number(result[3]);
@@ -8689,7 +8774,7 @@
       return;
     }
-     warning("\n    React version: [" + actual.raw + "]\n    does not satisfy expected peer dependency version: [" + peerDep.raw + "]\n\n    This can result in run time bugs, and even fatal crashes\n  ") ;
+    warning$2("\n    React version: [" + actual.raw + "]\n    does not satisfy expected peer dependency version: [" + peerDep.raw + "]\n\n    This can result in run time bugs, and even fatal crashes\n  ") ;
   });
   var suffix = "\n  We expect a html5 doctype: <!doctype html>\n  This is to ensure consistent browser layout and measurement\n\n  More information: https://github.com/atlassian/react-beautiful-dnd/blob/master/docs/guides/doctype.md\n";
@@ -8697,16 +8782,16 @@
     var doctype = doc.doctype;
     if (!doctype) {
-       warning("\n      No <!doctype html> found.\n\n      " + suffix + "\n    ") ;
+      warning$2("\n      No <!doctype html> found.\n\n      " + suffix + "\n    ") ;
       return;
     }
     if (doctype.name.toLowerCase() !== 'html') {
-       warning("\n      Unexpected <!doctype> found: (" + doctype.name + ")\n\n      " + suffix + "\n    ") ;
+      warning$2("\n      Unexpected <!doctype> found: (" + doctype.name + ")\n\n      " + suffix + "\n    ") ;
     }
     if (doctype.publicId !== '') {
-       warning("\n      Unexpected <!doctype> publicId found: (" + doctype.publicId + ")\n      A html5 doctype does not have a publicId\n\n      " + suffix + "\n    ") ;
+      warning$2("\n      Unexpected <!doctype> publicId found: (" + doctype.publicId + ")\n      A html5 doctype does not have a publicId\n\n      " + suffix + "\n    ") ;
     }
   });
@@ -8730,7 +8815,7 @@
   function useStartupValidation() {
     useDevSetupWarning(function () {
-      checkReactVersion(peerDependencies.react, React__default.version);
+      checkReactVersion(peerDependencies.react, React.version);
       checkDoctype(document);
     }, []);
   }
@@ -8755,7 +8840,7 @@
     }
     function claim(abandon) {
-      !!lock ?  invariant(false, 'Cannot claim lock as it is already claimed')  : void 0;
+      !!lock ? invariant$1(false, 'Cannot claim lock as it is already claimed')  : void 0;
       var newLock = {
         abandon: abandon
       };
@@ -8764,7 +8849,7 @@
     }
     function release() {
-      !lock ?  invariant(false, 'Cannot release lock when there is no lock')  : void 0;
+      !lock ? invariant$1(false, 'Cannot release lock when there is no lock')  : void 0;
       lock = null;
     }
@@ -8819,6 +8904,8 @@
     return supported || base;
   }();
+  var supportedPageVisibilityEventName = supportedEventName;
   var primaryButton = 0;
   var sloppyClickThreshold = 5;
@@ -8858,7 +8945,7 @@
           return;
         }
-        !(phase.type === 'PENDING') ?  invariant(false, 'Cannot be IDLE')  : void 0;
+        !(phase.type === 'PENDING') ? invariant$1(false, 'Cannot be IDLE')  : void 0;
         var pending = phase.point;
         if (!isSloppyClickThresholdExceeded(pending, point)) {
@@ -8933,7 +9020,7 @@
       eventName: 'webkitmouseforcedown',
       fn: function fn(event) {
         var phase = getPhase();
-        !(phase.type !== 'IDLE') ?  invariant(false, 'Unexpected phase')  : void 0;
+        !(phase.type !== 'IDLE') ? invariant$1(false, 'Unexpected phase')  : void 0;
         if (phase.actions.shouldRespectForcePress()) {
           cancel();
@@ -8943,14 +9030,14 @@
         event.preventDefault();
       }
     }, {
-      eventName: supportedEventName,
+      eventName: supportedPageVisibilityEventName,
       fn: cancel
     }];
   }
   function useMouseSensor(api) {
     var phaseRef = React.useRef(idle$1);
-    var unbindEventsRef = React.useRef(noop);
+    var unbindEventsRef = React.useRef(noop$2);
     var startCaptureBinding = useMemo(function () {
       return {
         eventName: 'mousedown',
@@ -9073,7 +9160,7 @@
       unbindEventsRef.current = bindEvents(window, bindings, options);
     }, [cancel, stop]);
     var startPendingDrag = useCallback(function startPendingDrag(actions, point) {
-      !(phaseRef.current.type === 'IDLE') ?  invariant(false, 'Expected to move from IDLE to PENDING drag')  : void 0;
+      !(phaseRef.current.type === 'IDLE') ? invariant$1(false, 'Expected to move from IDLE to PENDING drag')  : void 0;
       phaseRef.current = {
         type: 'PENDING',
         point: point,
@@ -9081,7 +9168,7 @@
       };
       bindCapturingEvents();
     }, [bindCapturingEvents]);
-    useIsomorphicLayoutEffect$1(function mount() {
+    useLayoutEffect(function mount() {
       listenForCapture();
       return function unmount() {
         unbindEventsRef.current();
@@ -9174,7 +9261,7 @@
         passive: true
       }
     }, {
-      eventName: supportedEventName,
+      eventName: supportedPageVisibilityEventName,
       fn: cancel
     }];
   }
@@ -9213,7 +9300,7 @@
           unbindEventsRef.current();
           function stop() {
-            !isCapturing ?  invariant(false, 'Cannot stop capturing a keyboard drag when not capturing')  : void 0;
+            !isCapturing ? invariant$1(false, 'Cannot stop capturing a keyboard drag when not capturing')  : void 0;
             isCapturing = false;
             unbindEventsRef.current();
             listenForCapture();
@@ -9233,7 +9320,7 @@
       };
       unbindEventsRef.current = bindEvents(window, [startCaptureBinding], options);
     }, [startCaptureBinding]);
-    useIsomorphicLayoutEffect$1(function mount() {
+    useLayoutEffect(function mount() {
       listenForCapture();
       return function unmount() {
         unbindEventsRef.current();
@@ -9241,7 +9328,7 @@
     }, [listenForCapture]);
   }
-  var idle$2 = {
+  var idle = {
     type: 'IDLE'
   };
   var timeForLongPress = 120;
@@ -9276,7 +9363,7 @@
         cancel();
       }
     }, {
-      eventName: supportedEventName,
+      eventName: supportedPageVisibilityEventName,
       fn: cancel
     }];
   }
@@ -9340,7 +9427,7 @@
       eventName: 'touchforcechange',
       fn: function fn(event) {
         var phase = getPhase();
-        !(phase.type !== 'IDLE') ?  invariant(false)  : void 0;
+        !(phase.type !== 'IDLE') ? invariant$1(false)  : void 0;
         var touch = event.touches[0];
         if (!touch) {
@@ -9376,14 +9463,14 @@
         event.preventDefault();
       }
     }, {
-      eventName: supportedEventName,
+      eventName: supportedPageVisibilityEventName,
       fn: cancel
     }];
   }
   function useTouchSensor(api) {
-    var phaseRef = React.useRef(idle$2);
-    var unbindEventsRef = React.useRef(noop);
+    var phaseRef = React.useRef(idle);
+    var unbindEventsRef = React.useRef(noop$2);
     var getPhase = useCallback(function getPhase() {
       return phaseRef.current;
     }, []);
@@ -9420,7 +9507,7 @@
             y: clientY
           };
           var handle = api.findClosestDragHandle(event);
-          !handle ?  invariant(false, 'Touch sensor unable to find drag handle')  : void 0;
+          !handle ? invariant$1(false, 'Touch sensor unable to find drag handle')  : void 0;
           unbindEventsRef.current();
           startPendingDrag(actions, point, handle);
         }
@@ -9444,7 +9531,7 @@
         clearTimeout(current.longPressTimerId);
       }
-      setPhase(idle$2);
+      setPhase(idle);
       unbindEventsRef.current();
       listenForCapture();
     }, [listenForCapture, setPhase]);
@@ -9482,7 +9569,7 @@
     }, [cancel, getPhase, stop]);
     var startDragging = useCallback(function startDragging() {
       var phase = getPhase();
-      !(phase.type === 'PENDING') ?  invariant(false, "Cannot start dragging from phase " + phase.type)  : void 0;
+      !(phase.type === 'PENDING') ? invariant$1(false, "Cannot start dragging from phase " + phase.type)  : void 0;
       var actions = phase.actions.fluidLift(phase.point);
       setPhase({
         type: 'DRAGGING',
@@ -9491,7 +9578,7 @@
       });
     }, [getPhase, setPhase]);
     var startPendingDrag = useCallback(function startPendingDrag(actions, point, target) {
-      !(getPhase().type === 'IDLE') ?  invariant(false, 'Expected to move from IDLE to PENDING drag')  : void 0;
+      !(getPhase().type === 'IDLE') ? invariant$1(false, 'Expected to move from IDLE to PENDING drag')  : void 0;
       var longPressTimerId = setTimeout(startDragging, timeForLongPress);
       setPhase({
         type: 'PENDING',
@@ -9501,7 +9588,7 @@
       });
       bindCapturingEvents(target);
     }, [bindCapturingEvents, getPhase, setPhase, startDragging]);
-    useIsomorphicLayoutEffect$1(function mount() {
+    useLayoutEffect(function mount() {
       listenForCapture();
       return function unmount() {
         unbindEventsRef.current();
@@ -9509,11 +9596,11 @@
         if (phase.type === 'PENDING') {
           clearTimeout(phase.longPressTimerId);
-          setPhase(idle$2);
+          setPhase(idle);
         }
       };
     }, [getPhase, listenForCapture, setPhase]);
-    useIsomorphicLayoutEffect$1(function webkitHack() {
+    useLayoutEffect(function webkitHack() {
       var unbind = bindEvents(window, [{
         eventName: 'touchmove',
         fn: function fn() {},
@@ -9530,7 +9617,7 @@
     useDev(function () {
       var previousRef = usePrevious(sensorHooks);
       useDevSetupWarning(function () {
-        !(previousRef.current.length === sensorHooks.length) ? "development" !== "production" ? invariant(false, 'Cannot change the amount of sensor hooks after mounting') : invariant(false) : void 0;
+        !(previousRef.current.length === sensorHooks.length) ? "development" !== "production" ? invariant$1(false, 'Cannot change the amount of sensor hooks after mounting') : invariant$1(false) : void 0;
       });
     });
   }
@@ -9614,7 +9701,7 @@
     return closestPonyfill(el.parentElement, selector);
   }
-  function closest$1(el, selector) {
+  function closest(el, selector) {
     if (el.closest) {
       return el.closest(selector);
     }
@@ -9630,19 +9717,19 @@
     var target = event.target;
     if (!isElement(target)) {
-       warning('event.target must be a Element') ;
+      warning$2('event.target must be a Element') ;
       return null;
     }
     var selector = getSelector(contextId);
-    var handle = closest$1(target, selector);
+    var handle = closest(target, selector);
     if (!handle) {
       return null;
     }
     if (!isHtmlElement(handle)) {
-       warning('drag handle must be a HTMLElement') ;
+      warning$2('drag handle must be a HTMLElement') ;
       return null;
     }
@@ -9670,7 +9757,7 @@
     }
     if (!isHtmlElement(draggable$1)) {
-       warning('Draggable element is not a HTMLElement') ;
+      warning$2('Draggable element is not a HTMLElement') ;
       return null;
     }
@@ -9689,7 +9776,7 @@
     if (!isLockActive()) {
       if (shouldWarn) {
-         warning("\n        Cannot perform action.\n        The sensor no longer has an action lock.\n\n        Tips:\n\n        - Throw away your action handlers when forceStop() is called\n        - Check actions.isActive() if you really need to\n      ") ;
+        warning$2("\n        Cannot perform action.\n        The sensor no longer has an action lock.\n\n        Tips:\n\n        - Throw away your action handlers when forceStop() is called\n        - Check actions.isActive() if you really need to\n      ") ;
       }
       return false;
@@ -9697,7 +9784,7 @@
     if (expected !== phase) {
       if (shouldWarn) {
-         warning("\n        Cannot perform action.\n        The actions you used belong to an outdated phase\n\n        Current phase: " + expected + "\n        You called an action from outdated phase: " + phase + "\n\n        Tips:\n\n        - Do not use preDragActions actions after calling preDragActions.lift()\n      ") ;
+        warning$2("\n        Cannot perform action.\n        The actions you used belong to an outdated phase\n\n        Current phase: " + expected + "\n        You called an action from outdated phase: " + phase + "\n\n        Tips:\n\n        - Do not use preDragActions actions after calling preDragActions.lift()\n      ") ;
       }
       return false;
@@ -9719,7 +9806,7 @@
     var entry = registry.draggable.findById(draggableId);
     if (!entry) {
-       warning("Unable to find draggable with id: " + draggableId) ;
+      warning$2("Unable to find draggable with id: " + draggableId) ;
       return false;
     }
@@ -9757,7 +9844,7 @@
     var el = findDraggable(contextId, entry.descriptor.id);
     if (!el) {
-       warning("Unable to find draggable element with id: " + draggableId) ;
+      warning$2("Unable to find draggable element with id: " + draggableId) ;
       return null;
     }
@@ -9765,7 +9852,7 @@
       return null;
     }
-    var lock = lockAPI.claim(forceSensorStop || noop);
+    var lock = lockAPI.claim(forceSensorStop || noop$2);
     var phase = 'PRE_DRAG';
     function getShouldRespectForcePress() {
@@ -9789,7 +9876,7 @@
     var tryDispatchWhenDragging = tryDispatch.bind(null, 'DRAGGING');
-    function lift$1(args) {
+    function lift(args) {
       function completed() {
         lockAPI.release();
         phase = 'COMPLETED';
@@ -9797,10 +9884,10 @@
       if (phase !== 'PRE_DRAG') {
         completed();
-        !(phase === 'PRE_DRAG') ?  invariant(false, "Cannot lift in phase " + phase)  : void 0;
+        !(phase === 'PRE_DRAG') ? invariant$1(false, "Cannot lift in phase " + phase)  : void 0;
       }
-      store.dispatch(lift(args.liftActionArgs));
+      store.dispatch(lift$1(args.liftActionArgs));
       phase = 'DRAGGING';
       function finish(reason, options) {
@@ -9826,12 +9913,12 @@
         }
         completed();
-        store.dispatch(drop({
+        store.dispatch(drop$1({
           reason: reason
         }));
       }
-      return _extends({
+      return _extends$1({
         isActive: function isActive() {
           return _isActive({
             expected: 'DRAGGING',
@@ -9851,14 +9938,14 @@
     }
     function fluidLift(clientSelection) {
-      var move$1 = rafSchd(function (client) {
+      var move$1 = rafSchedule(function (client) {
         tryDispatchWhenDragging(function () {
           return move({
             client: client
           });
         });
       });
-      var api = lift$1({
+      var api = lift({
         liftActionArgs: {
           id: draggableId,
           clientSelection: clientSelection,
@@ -9871,7 +9958,7 @@
           move: move$1
         }
       });
-      return _extends({}, api, {
+      return _extends$1({}, api, {
         move: move$1
       });
     }
@@ -9891,13 +9978,13 @@
           return tryDispatchWhenDragging(moveLeft);
         }
       };
-      return lift$1({
+      return lift({
         liftActionArgs: {
           id: draggableId,
           clientSelection: getBorderBoxCenterPosition(el),
           movementMode: 'SNAP'
         },
-        cleanup: noop,
+        cleanup: noop$2,
         actions: actions
       });
     }
@@ -9948,7 +10035,7 @@
         lockAPI.tryAbandon();
       }
     }, [lockAPI]);
-    useIsomorphicLayoutEffect$1(function listenToStore() {
+    useLayoutEffect(function listenToStore() {
       var previous = store.getState();
       var unsubscribe = store.subscribe(function () {
         var current = store.getState();
@@ -9957,7 +10044,7 @@
       });
       return unsubscribe;
     }, [lockAPI, store, tryAbandonLock]);
-    useIsomorphicLayoutEffect$1(function () {
+    useLayoutEffect(function () {
       return lockAPI.tryAbandon;
     }, [lockAPI.tryAbandon]);
     var canGetLock = useCallback(function (draggableId) {
@@ -10030,7 +10117,7 @@
   };
   function getStore(lazyRef) {
-    !lazyRef.current ?  invariant(false, 'Could not find store from lazy ref')  : void 0;
+    !lazyRef.current ? invariant$1(false, 'Could not find store from lazy ref')  : void 0;
     return lazyRef.current;
   }
@@ -10071,7 +10158,7 @@
     }, [registry, marshalCallbacks]);
     var fluidScrollerOptionsRef = React.useRef(fluidScrollerOptions);
     var autoScroller = useMemo(function () {
-      return createAutoScroller(_extends({
+      return createAutoScroller(_extends$1({
         scrollWindow: scrollWindow,
         scrollDroppable: dimensionMarshal.scrollDroppable
       }, bindActionCreators({
@@ -10082,7 +10169,7 @@
     }, [dimensionMarshal.scrollDroppable, lazyDispatch]);
     var focusMarshal = useFocusMarshal(contextId);
     var store = useMemo(function () {
-      return createStore$1({
+      return createStore({
         announce: announce,
         autoScroller: autoScroller,
         dimensionMarshal: dimensionMarshal,
@@ -10094,7 +10181,7 @@
     {
       if (lazyStoreRef.current && lazyStoreRef.current !== store) {
-         warning('unexpected store change') ;
+        warning$2('unexpected store change') ;
       }
     }
@@ -10146,33 +10233,33 @@
     React.useEffect(function () {
       return tryResetStore;
     }, [tryResetStore]);
-    return React__default.createElement(AppContext.Provider, {
+    return React.createElement(AppContext.Provider, {
       value: appContext
-    }, React__default.createElement(Provider, {
+    }, React.createElement(Provider, {
       context: StoreContext,
       store: store
     }, props.children));
   }
-  var count$1 = 0;
-  function reset$1() {
-    count$1 = 0;
+  var count = 0;
+  function reset() {
+    count = 0;
   }
   function useInstanceCount() {
     return useMemo(function () {
-      return "" + count$1++;
+      return "" + count++;
     }, []);
   }
   function resetServerContext() {
-    reset$1();
     reset();
+    reset$1();
   }
   function DragDropContext(props) {
     var contextId = useInstanceCount();
-    var dragHandleUsageInstructions = props.dragHandleUsageInstructions || preset.dragHandleUsageInstructions;
-    return React__default.createElement(ErrorBoundary, null, function (setCallbacks) {
-      return React__default.createElement(App, {
+    var dragHandleUsageInstructions = props.dragHandleUsageInstructions || preset$1.dragHandleUsageInstructions;
+    return React.createElement(ErrorBoundary, null, function (setCallbacks) {
+      return React.createElement(App, {
         nonce: props.nonce,
         contextId: contextId,
         setCallbacks: setCallbacks,
@@ -10189,15 +10276,15 @@
     });
   }
-  var isEqual$1 = function isEqual(base) {
+  var isEqual = function isEqual(base) {
     return function (value) {
       return base === value;
     };
   };
-  var isScroll = isEqual$1('scroll');
-  var isAuto = isEqual$1('auto');
-  var isVisible$1 = isEqual$1('visible');
+  var isScroll = isEqual('scroll');
+  var isAuto = isEqual('auto');
+  var isVisible = isEqual('visible');
   var isEither = function isEither(overflow, fn) {
     return fn(overflow.overflowX) || fn(overflow.overflowY);
@@ -10225,7 +10312,7 @@
     var body = getBodyElement();
     var html = document.documentElement;
-    !html ?  invariant(false)  : void 0;
+    !html ? invariant$1(false)  : void 0;
     if (!isElementScrollable(body)) {
       return false;
@@ -10237,11 +10324,11 @@
       overflowY: htmlStyle.overflowY
     };
-    if (isBoth(htmlOverflow, isVisible$1)) {
+    if (isBoth(htmlOverflow, isVisible)) {
       return false;
     }
-     warning("\n    We have detected that your <body> element might be a scroll container.\n    We have found no reliable way of detecting whether the <body> element is a scroll container.\n    Under most circumstances a <body> scroll bar will be on the <html> element (document.documentElement)\n\n    Because we cannot determine if the <body> is a scroll container, and generally it is not one,\n    we will be treating the <body> as *not* a scroll container\n\n    More information: https://github.com/atlassian/react-beautiful-dnd/blob/master/docs/guides/how-we-detect-scroll-containers.md\n  ") ;
+    warning$2("\n    We have detected that your <body> element might be a scroll container.\n    We have found no reliable way of detecting whether the <body> element is a scroll container.\n    Under most circumstances a <body> scroll bar will be on the <html> element (document.documentElement)\n\n    Because we cannot determine if the <body> is a scroll container, and generally it is not one,\n    we will be treating the <body> as *not* a scroll container\n\n    More information: https://github.com/atlassian/react-beautiful-dnd/blob/master/docs/guides/how-we-detect-scroll-containers.md\n  ") ;
     return false;
   };
@@ -10265,21 +10352,23 @@
     return el;
   };
+  var getClosestScrollable$1 = getClosestScrollable;
   var checkForNestedScrollContainers = (function (scrollable) {
     if (!scrollable) {
       return;
     }
-    var anotherScrollParent = getClosestScrollable(scrollable.parentElement);
+    var anotherScrollParent = getClosestScrollable$1(scrollable.parentElement);
     if (!anotherScrollParent) {
       return;
     }
-     warning("\n    Droppable: unsupported nested scroll container detected.\n    A Droppable can only have one scroll parent (which can be itself)\n    Nested scroll containers are currently not supported.\n\n    We hope to support nested scroll containers soon: https://github.com/atlassian/react-beautiful-dnd/issues/131\n  ") ;
+    warning$2("\n    Droppable: unsupported nested scroll container detected.\n    A Droppable can only have one scroll parent (which can be itself)\n    Nested scroll containers are currently not supported.\n\n    We hope to support nested scroll containers soon: https://github.com/atlassian/react-beautiful-dnd/issues/131\n  ") ;
   });
-  var getScroll$1 = (function (el) {
+  var getScroll = (function (el) {
     return {
       x: el.scrollLeft,
       y: el.scrollTop
@@ -10301,7 +10390,7 @@
   };
   var getEnv = (function (start) {
-    var closestScrollable = getClosestScrollable(start);
+    var closestScrollable = getClosestScrollable$1(start);
     var isFixedOnPage = getIsFixed(start);
     return {
       closestScrollable: closestScrollable,
@@ -10401,7 +10490,7 @@
     return client;
   };
-  var getDimension = (function (_ref) {
+  var getDimension$1 = (function (_ref) {
     var ref = _ref.ref,
         descriptor = _ref.descriptor,
         env = _ref.env,
@@ -10427,7 +10516,7 @@
       return {
         client: frameClient,
         page: withScroll(frameClient, windowScroll),
-        scroll: getScroll$1(closestScrollable),
+        scroll: getScroll(closestScrollable),
         scrollSize: scrollSize,
         shouldClipSubject: shouldClipSubject
       };
@@ -10458,7 +10547,7 @@
   function useRequiredContext(Context) {
     var result = React.useContext(Context);
-    !result ?  invariant(false, 'Could not find required context')  : void 0;
+    !result ? invariant$1(false, 'Could not find required context')  : void 0;
     return result;
   }
@@ -10483,7 +10572,7 @@
     var publishedDescriptorRef = React.useRef(descriptor);
     var memoizedUpdateScroll = useMemo(function () {
       return memoizeOne(function (x, y) {
-        !whileDraggingRef.current ?  invariant(false, 'Can only update scroll when dragging')  : void 0;
+        !whileDraggingRef.current ? invariant$1(false, 'Can only update scroll when dragging')  : void 0;
         var scroll = {
           x: x,
           y: y
@@ -10498,19 +10587,19 @@
         return origin;
       }
-      return getScroll$1(dragging.env.closestScrollable);
+      return getScroll(dragging.env.closestScrollable);
     }, []);
     var updateScroll = useCallback(function () {
       var scroll = getClosestScroll();
       memoizedUpdateScroll(scroll.x, scroll.y);
     }, [getClosestScroll, memoizedUpdateScroll]);
     var scheduleScrollUpdate = useMemo(function () {
-      return rafSchd(updateScroll);
+      return rafSchedule(updateScroll);
     }, [updateScroll]);
     var onClosestScroll = useCallback(function () {
       var dragging = whileDraggingRef.current;
       var closest = getClosestScrollableFromDrag(dragging);
-      !(dragging && closest) ?  invariant(false, 'Could not find scroll options while scrolling')  : void 0;
+      !(dragging && closest) ? invariant$1(false, 'Could not find scroll options while scrolling')  : void 0;
       var options = dragging.scrollOptions;
       if (options.shouldPublishImmediately) {
@@ -10521,10 +10610,10 @@
       scheduleScrollUpdate();
     }, [scheduleScrollUpdate, updateScroll]);
     var getDimensionAndWatchScroll = useCallback(function (windowScroll, options) {
-      !!whileDraggingRef.current ?  invariant(false, 'Cannot collect a droppable while a drag is occurring')  : void 0;
+      !!whileDraggingRef.current ? invariant$1(false, 'Cannot collect a droppable while a drag is occurring')  : void 0;
       var previous = previousRef.current;
       var ref = previous.getDroppableRef();
-      !ref ?  invariant(false, 'Cannot collect without a droppable ref')  : void 0;
+      !ref ? invariant$1(false, 'Cannot collect without a droppable ref')  : void 0;
       var env = getEnv(ref);
       var dragging = {
         ref: ref,
@@ -10533,7 +10622,7 @@
         scrollOptions: options
       };
       whileDraggingRef.current = dragging;
-      var dimension = getDimension({
+      var dimension = getDimension$1({
         ref: ref,
         descriptor: descriptor,
         env: env,
@@ -10559,12 +10648,12 @@
     var getScrollWhileDragging = useCallback(function () {
       var dragging = whileDraggingRef.current;
       var closest = getClosestScrollableFromDrag(dragging);
-      !(dragging && closest) ?  invariant(false, 'Can only recollect Droppable client for Droppables that have a scroll container')  : void 0;
-      return getScroll$1(closest);
+      !(dragging && closest) ? invariant$1(false, 'Can only recollect Droppable client for Droppables that have a scroll container')  : void 0;
+      return getScroll(closest);
     }, []);
     var dragStopped = useCallback(function () {
       var dragging = whileDraggingRef.current;
-      !dragging ?  invariant(false, 'Cannot stop drag when no active drag')  : void 0;
+      !dragging ? invariant$1(false, 'Cannot stop drag when no active drag')  : void 0;
       var closest = getClosestScrollableFromDrag(dragging);
       whileDraggingRef.current = null;
@@ -10578,9 +10667,9 @@
     }, [onClosestScroll, scheduleScrollUpdate]);
     var scroll = useCallback(function (change) {
       var dragging = whileDraggingRef.current;
-      !dragging ?  invariant(false, 'Cannot scroll when there is no drag')  : void 0;
+      !dragging ? invariant$1(false, 'Cannot scroll when there is no drag')  : void 0;
       var closest = getClosestScrollableFromDrag(dragging);
-      !closest ?  invariant(false, 'Cannot scroll a droppable with no closest scrollable')  : void 0;
+      !closest ? invariant$1(false, 'Cannot scroll a droppable with no closest scrollable')  : void 0;
       closest.scrollTop += change.y;
       closest.scrollLeft += change.x;
     }, []);
@@ -10599,26 +10688,26 @@
         callbacks: callbacks
       };
     }, [callbacks, descriptor, uniqueId]);
-    useIsomorphicLayoutEffect$1(function () {
+    useLayoutEffect(function () {
       publishedDescriptorRef.current = entry.descriptor;
       registry.droppable.register(entry);
       return function () {
         if (whileDraggingRef.current) {
-           warning('Unsupported: changing the droppableId or type of a Droppable during a drag') ;
+          warning$2('Unsupported: changing the droppableId or type of a Droppable during a drag') ;
           dragStopped();
         }
         registry.droppable.unregister(entry);
       };
     }, [callbacks, descriptor, dragStopped, entry, marshal, registry.droppable]);
-    useIsomorphicLayoutEffect$1(function () {
+    useLayoutEffect(function () {
       if (!whileDraggingRef.current) {
         return;
       }
       marshal.updateDroppableIsEnabled(publishedDescriptorRef.current.id, !args.isDropDisabled);
     }, [args.isDropDisabled, marshal]);
-    useIsomorphicLayoutEffect$1(function () {
+    useLayoutEffect(function () {
       if (!whileDraggingRef.current) {
         return;
       }
@@ -10627,12 +10716,12 @@
     }, [args.isCombineEnabled, marshal]);
   }
-  function noop$2() {}
+  function noop() {}
   var empty = {
     width: 0,
     height: 0,
-    margin: noSpacing$1
+    margin: noSpacing
   };
   var getSize = function getSize(_ref) {
@@ -10655,7 +10744,7 @@
     };
   };
-  var getStyle = function getStyle(_ref2) {
+  var getStyle$1 = function getStyle(_ref2) {
     var isAnimatingOpenOnMount = _ref2.isAnimatingOpenOnMount,
         placeholder = _ref2.placeholder,
         animate = _ref2.animate;
@@ -10701,17 +10790,17 @@
     React.useEffect(function () {
       if (!isAnimatingOpenOnMount) {
-        return noop$2;
+        return noop;
       }
       if (animate !== 'open') {
         tryClearAnimateOpenTimer();
         setIsAnimatingOpenOnMount(false);
-        return noop$2;
+        return noop;
       }
       if (animateOpenTimerRef.current) {
-        return noop$2;
+        return noop;
       }
       animateOpenTimerRef.current = setTimeout(function () {
@@ -10731,12 +10820,12 @@
         onClose();
       }
     }, [animate, onClose, onTransitionEnd]);
-    var style = getStyle({
+    var style = getStyle$1({
       isAnimatingOpenOnMount: isAnimatingOpenOnMount,
       animate: props.animate,
       placeholder: props.placeholder
     });
-    return React__default.createElement(props.placeholder.tagName, {
+    return React.createElement(props.placeholder.tagName, {
       style: style,
       'data-rbd-placeholder-context-id': contextId,
       onTransitionEnd: onSizeChangeEnd,
@@ -10744,12 +10833,12 @@
     });
   }
-  var Placeholder$1 = React__default.memo(Placeholder);
+  var Placeholder$1 = React.memo(Placeholder);
-  var DroppableContext = React__default.createContext(null);
+  var DroppableContext = React.createContext(null);
   function checkIsValidInnerRef(el) {
-    !(el && isHtmlElement(el)) ?  invariant(false, "\n    provided.innerRef has not been provided with a HTMLElement.\n\n    You can find a guide on using the innerRef callback functions at:\n    https://github.com/atlassian/react-beautiful-dnd/blob/master/docs/guides/using-inner-ref.md\n  ")  : void 0;
+    !(el && isHtmlElement(el)) ? invariant$1(false, "\n    provided.innerRef has not been provided with a HTMLElement.\n\n    You can find a guide on using the innerRef callback functions at:\n    https://github.com/atlassian/react-beautiful-dnd/blob/master/docs/guides/using-inner-ref.md\n  ")  : void 0;
   }
   function isBoolean(value) {
@@ -10764,13 +10853,13 @@
   var shared = [function required(_ref) {
     var props = _ref.props;
-    !props.droppableId ?  invariant(false, 'A Droppable requires a droppableId prop')  : void 0;
-    !(typeof props.droppableId === 'string') ?  invariant(false, "A Droppable requires a [string] droppableId. Provided: [" + typeof props.droppableId + "]")  : void 0;
+    !props.droppableId ? invariant$1(false, 'A Droppable requires a droppableId prop')  : void 0;
+    !(typeof props.droppableId === 'string') ? invariant$1(false, "A Droppable requires a [string] droppableId. Provided: [" + typeof props.droppableId + "]")  : void 0;
   }, function _boolean(_ref2) {
     var props = _ref2.props;
-    !isBoolean(props.isDropDisabled) ?  invariant(false, 'isDropDisabled must be a boolean')  : void 0;
-    !isBoolean(props.isCombineEnabled) ?  invariant(false, 'isCombineEnabled must be a boolean')  : void 0;
-    !isBoolean(props.ignoreContainerClipping) ?  invariant(false, 'ignoreContainerClipping must be a boolean')  : void 0;
+    !isBoolean(props.isDropDisabled) ? invariant$1(false, 'isDropDisabled must be a boolean')  : void 0;
+    !isBoolean(props.isCombineEnabled) ? invariant$1(false, 'isCombineEnabled must be a boolean')  : void 0;
+    !isBoolean(props.ignoreContainerClipping) ? invariant$1(false, 'ignoreContainerClipping must be a boolean')  : void 0;
   }, function ref(_ref3) {
     var getDroppableRef = _ref3.getDroppableRef;
     checkIsValidInnerRef(getDroppableRef());
@@ -10789,16 +10878,16 @@
       return;
     }
-     warning("\n      Droppable setup issue [droppableId: \"" + props.droppableId + "\"]:\n      DroppableProvided > placeholder could not be found.\n\n      Please be sure to add the {provided.placeholder} React Node as a child of your Droppable.\n      More information: https://github.com/atlassian/react-beautiful-dnd/blob/master/docs/api/droppable.md\n    ") ;
+    warning$2("\n      Droppable setup issue [droppableId: \"" + props.droppableId + "\"]:\n      DroppableProvided > placeholder could not be found.\n\n      Please be sure to add the {provided.placeholder} React Node as a child of your Droppable.\n      More information: https://github.com/atlassian/react-beautiful-dnd/blob/master/docs/api/droppable.md\n    ") ;
   }];
   var virtual = [function hasClone(_ref5) {
     var props = _ref5.props;
-    !props.renderClone ?  invariant(false, 'Must provide a clone render function (renderClone) for virtual lists')  : void 0;
+    !props.renderClone ? invariant$1(false, 'Must provide a clone render function (renderClone) for virtual lists')  : void 0;
   }, function hasNoPlaceholder(_ref6) {
     var getPlaceholderRef = _ref6.getPlaceholderRef;
-    !!getPlaceholderRef() ?  invariant(false, 'Expected virtual list to not have a placeholder')  : void 0;
+    !!getPlaceholderRef() ? invariant$1(false, 'Expected virtual list to not have a placeholder')  : void 0;
   }];
-  function useValidation(args) {
+  function useValidation$1(args) {
     useDevSetupWarning(function () {
       runChecks(args, shared);
@@ -10890,7 +10979,7 @@
     };
     return AnimateInOut;
-  }(React__default.PureComponent);
+  }(React.PureComponent);
   var zIndexOptions = {
     dragging: 5000,
@@ -10958,11 +11047,11 @@
     };
   }
-  function getStyle$1(mapped) {
+  function getStyle(mapped) {
     return mapped.type === 'DRAGGING' ? getDraggingStyle(mapped) : getSecondaryStyle(mapped);
   }
-  function getDimension$1(descriptor, el, windowScroll) {
+  function getDimension(descriptor, el, windowScroll) {
     if (windowScroll === void 0) {
       windowScroll = origin;
     }
@@ -11005,28 +11094,28 @@
         isEnabled: isEnabled
       };
     }, [canDragInteractiveElements, isEnabled, shouldRespectForcePress]);
-    var getDimension = useCallback(function (windowScroll) {
+    var getDimension$1 = useCallback(function (windowScroll) {
       var el = getDraggableRef();
-      !el ?  invariant(false, 'Cannot get dimension when no ref is set')  : void 0;
-      return getDimension$1(descriptor, el, windowScroll);
+      !el ? invariant$1(false, 'Cannot get dimension when no ref is set')  : void 0;
+      return getDimension(descriptor, el, windowScroll);
     }, [descriptor, getDraggableRef]);
     var entry = useMemo(function () {
       return {
         uniqueId: uniqueId,
         descriptor: descriptor,
         options: options,
-        getDimension: getDimension
+        getDimension: getDimension$1
       };
-    }, [descriptor, getDimension, options, uniqueId]);
+    }, [descriptor, getDimension$1, options, uniqueId]);
     var publishedRef = React.useRef(entry);
     var isFirstPublishRef = React.useRef(true);
-    useIsomorphicLayoutEffect$1(function () {
+    useLayoutEffect(function () {
       registry.draggable.register(publishedRef.current);
       return function () {
         return registry.draggable.unregister(publishedRef.current);
       };
     }, [registry.draggable]);
-    useIsomorphicLayoutEffect$1(function () {
+    useLayoutEffect(function () {
       if (isFirstPublishRef.current) {
         isFirstPublishRef.current = false;
         return;
@@ -11038,16 +11127,16 @@
     }, [entry, registry.draggable]);
   }
-  function useValidation$1(props, contextId, getRef) {
+  function useValidation(props, contextId, getRef) {
     useDevSetupWarning(function () {
       function prefix(id) {
         return "Draggable[id: " + id + "]: ";
       }
       var id = props.draggableId;
-      !id ? "development" !== "production" ? invariant(false, 'Draggable requires a draggableId') : invariant(false) : void 0;
-      !(typeof id === 'string') ? "development" !== "production" ? invariant(false, "Draggable requires a [string] draggableId.\n      Provided: [type: " + typeof id + "] (value: " + id + ")") : invariant(false) : void 0;
-      !isInteger(props.index) ? "development" !== "production" ? invariant(false, prefix(id) + " requires an integer index prop") : invariant(false) : void 0;
+      !id ? "development" !== "production" ? invariant$1(false, 'Draggable requires a draggableId') : invariant$1(false) : void 0;
+      !(typeof id === 'string') ? "development" !== "production" ? invariant$1(false, "Draggable requires a [string] draggableId.\n      Provided: [type: " + typeof id + "] (value: " + id + ")") : invariant$1(false) : void 0;
+      !isInteger(props.index) ? "development" !== "production" ? invariant$1(false, prefix(id) + " requires an integer index prop") : invariant$1(false) : void 0;
       if (props.mapped.type === 'DRAGGING') {
         return;
@@ -11056,7 +11145,7 @@
       checkIsValidInnerRef(getRef());
       if (props.isEnabled) {
-        !findDragHandle(contextId, id) ? "development" !== "production" ? invariant(false, prefix(id) + " Unable to find drag handle") : invariant(false) : void 0;
+        !findDragHandle(contextId, id) ? "development" !== "production" ? invariant$1(false, prefix(id) + " Unable to find drag handle") : invariant$1(false) : void 0;
       }
     });
   }
@@ -11064,7 +11153,7 @@
     useDev(function () {
       var initialRef = React.useRef(isClone);
       useDevSetupWarning(function () {
-        !(isClone === initialRef.current) ? "development" !== "production" ? invariant(false, 'Draggable isClone prop value changed during component life') : invariant(false) : void 0;
+        !(isClone === initialRef.current) ? "development" !== "production" ? invariant$1(false, 'Draggable isClone prop value changed during component life') : invariant$1(false) : void 0;
       }, [isClone]);
     });
   }
@@ -11107,7 +11196,7 @@
         isClone = props.isClone,
         mapped = props.mapped,
         dropAnimationFinishedAction = props.dropAnimationFinished;
-    useValidation$1(props, contextId, getRef);
+    useValidation(props, contextId, getRef);
     useClonePropValidation(isClone);
     if (!isClone) {
@@ -11151,7 +11240,7 @@
       dropAnimationFinishedAction();
     }, [dropAnimationFinishedAction, mapped]);
     var provided = useMemo(function () {
-      var style = getStyle$1(mapped);
+      var style = getStyle(mapped);
       var onTransitionEnd = mapped.type === 'DRAGGING' && mapped.dropping ? onMoveEnd : null;
       var result = {
         innerRef: setRef,
@@ -11406,7 +11495,7 @@
     return selector;
   }
-  var makeMapStateToProps = function makeMapStateToProps() {
+  var makeMapStateToProps$1 = function makeMapStateToProps() {
     var draggingSelector = getDraggableSelector();
     var secondarySelector = getSecondarySelector();
@@ -11416,14 +11505,15 @@
     return selector;
   };
-  var mapDispatchToProps = {
+  var mapDispatchToProps$1 = {
     dropAnimationFinished: dropAnimationFinished
   };
-  var ConnectedDraggable = connect(makeMapStateToProps, mapDispatchToProps, null, {
+  var ConnectedDraggable = connect(makeMapStateToProps$1, mapDispatchToProps$1, null, {
     context: StoreContext,
     pure: true,
     areStatePropsEqual: isStrictEqual
   })(Draggable);
+  var ConnectedDraggable$1 = ConnectedDraggable;
   function PrivateDraggable(props) {
     var droppableContext = useRequiredContext(DroppableContext);
@@ -11433,13 +11523,13 @@
       return null;
     }
-    return React__default.createElement(ConnectedDraggable, props);
+    return React.createElement(ConnectedDraggable$1, props);
   }
   function PublicDraggable(props) {
     var isEnabled = typeof props.isDragDisabled === 'boolean' ? !props.isDragDisabled : true;
     var canDragInteractiveElements = Boolean(props.disableInteractiveElementBlocking);
     var shouldRespectForcePress = Boolean(props.shouldRespectForcePress);
-    return React__default.createElement(PrivateDraggable, _extends({}, props, {
+    return React.createElement(PrivateDraggable, _extends$1({}, props, {
       isClone: false,
       isEnabled: isEnabled,
       canDragInteractiveElements: canDragInteractiveElements,
@@ -11449,7 +11539,7 @@
   function Droppable(props) {
     var appContext = React.useContext(AppContext);
-    !appContext ?  invariant(false, 'Could not find app context')  : void 0;
+    !appContext ? invariant$1(false, 'Could not find app context')  : void 0;
     var contextId = appContext.contextId,
         isMovementAllowed = appContext.isMovementAllowed;
     var droppableRef = React.useRef(null);
@@ -11478,7 +11568,7 @@
     var setPlaceholderRef = useCallback(function (value) {
       placeholderRef.current = value;
     }, []);
-    useValidation({
+    useValidation$1({
       props: props,
       getDroppableRef: getDroppableRef,
       getPlaceholderRef: getPlaceholderRef
@@ -11500,14 +11590,14 @@
       ignoreContainerClipping: ignoreContainerClipping,
       getDroppableRef: getDroppableRef
     });
-    var placeholder = React__default.createElement(AnimateInOut, {
+    var placeholder = React.createElement(AnimateInOut, {
       on: props.placeholder,
       shouldAnimate: props.shouldAnimatePlaceholder
     }, function (_ref) {
       var onClose = _ref.onClose,
           data = _ref.data,
           animate = _ref.animate;
-      return React__default.createElement(Placeholder$1, {
+      return React.createElement(Placeholder$1, {
         placeholder: data,
         onClose: onClose,
         innerRef: setPlaceholderRef,
@@ -11542,7 +11632,7 @@
       var dragging = useClone.dragging,
           render = useClone.render;
-      var node = React__default.createElement(PrivateDraggable, {
+      var node = React.createElement(PrivateDraggable, {
         draggableId: dragging.draggableId,
         index: dragging.source.index,
         isClone: true,
@@ -11552,14 +11642,46 @@
       }, function (draggableProvided, draggableSnapshot) {
         return render(draggableProvided, draggableSnapshot, dragging);
       });
-      return ReactDOM__default.createPortal(node, getContainerForClone());
+      return ReactDOM.createPortal(node, getContainerForClone());
     }
-    return React__default.createElement(DroppableContext.Provider, {
+    return React.createElement(DroppableContext.Provider, {
       value: droppableContext
     }, children(provided, snapshot), getClone());
   }
+  function getBody() {
+    !document.body ? invariant$1(false, 'document.body is not ready')  : void 0;
+    return document.body;
+  }
+  var defaultProps = {
+    mode: 'standard',
+    type: 'DEFAULT',
+    direction: 'vertical',
+    isDropDisabled: false,
+    isCombineEnabled: false,
+    ignoreContainerClipping: false,
+    renderClone: null,
+    getContainerForClone: getBody
+  };
+  var attachDefaultPropsToOwnProps = function attachDefaultPropsToOwnProps(ownProps) {
+    var mergedProps = _extends$1({}, ownProps);
+    var defaultPropKey;
+    for (defaultPropKey in defaultProps) {
+      if (ownProps[defaultPropKey] === undefined) {
+        var _extends2;
+        mergedProps = _extends$1({}, mergedProps, (_extends2 = {}, _extends2[defaultPropKey] = defaultProps[defaultPropKey], _extends2));
+      }
+    }
+    return mergedProps;
+  };
   var isMatchingType = function isMatchingType(type, critical) {
     return type === critical.droppable.type;
   };
@@ -11568,7 +11690,7 @@
     return dimensions.draggables[critical.draggable.id];
   };
-  var makeMapStateToProps$1 = function makeMapStateToProps() {
+  var makeMapStateToProps = function makeMapStateToProps() {
     var idleWithAnimation = {
       placeholder: null,
       shouldAnimatePlaceholder: true,
@@ -11581,7 +11703,7 @@
       useClone: null
     };
-    var idleWithoutAnimation = _extends({}, idleWithAnimation, {
+    var idleWithoutAnimation = _extends$1({}, idleWithAnimation, {
       shouldAnimatePlaceholder: false
     });
@@ -11641,10 +11763,11 @@
     });
     var selector = function selector(state, ownProps) {
-      var id = ownProps.droppableId;
-      var type = ownProps.type;
-      var isEnabled = !ownProps.isDropDisabled;
-      var renderClone = ownProps.renderClone;
+      var ownPropsWithDefaultProps = attachDefaultPropsToOwnProps(ownProps);
+      var id = ownPropsWithDefaultProps.droppableId;
+      var type = ownPropsWithDefaultProps.type;
+      var isEnabled = !ownPropsWithDefaultProps.isDropDisabled;
+      var renderClone = ownPropsWithDefaultProps.renderClone;
       if (state.isDragging) {
         var critical = state.critical;
@@ -11697,40 +11820,24 @@
     return selector;
   };
-  var mapDispatchToProps$1 = {
+  var mapDispatchToProps = {
     updateViewportMaxScroll: updateViewportMaxScroll
   };
-  function getBody() {
-    !document.body ?  invariant(false, 'document.body is not ready')  : void 0;
-    return document.body;
-  }
-  var defaultProps = {
-    mode: 'standard',
-    type: 'DEFAULT',
-    direction: 'vertical',
-    isDropDisabled: false,
-    isCombineEnabled: false,
-    ignoreContainerClipping: false,
-    renderClone: null,
-    getContainerForClone: getBody
-  };
-  var ConnectedDroppable = connect(makeMapStateToProps$1, mapDispatchToProps$1, null, {
+  var ConnectedDroppable = connect(makeMapStateToProps, mapDispatchToProps, function (stateProps, dispatchProps, ownProps) {
+    return _extends$1({}, attachDefaultPropsToOwnProps(ownProps), {}, stateProps, {}, dispatchProps);
+  }, {
     context: StoreContext,
     pure: true,
     areStatePropsEqual: isStrictEqual
   })(Droppable);
-  ConnectedDroppable.defaultProps = defaultProps;
+  var ConnectedDroppable$1 = ConnectedDroppable;
   exports.DragDropContext = DragDropContext;
   exports.Draggable = PublicDraggable;
-  exports.Droppable = ConnectedDroppable;
+  exports.Droppable = ConnectedDroppable$1;
   exports.resetServerContext = resetServerContext;
   exports.useKeyboardSensor = useKeyboardSensor;
   exports.useMouseSensor = useMouseSensor;
   exports.useTouchSensor = useTouchSensor;
-  Object.defineProperty(exports, '__esModule', { value: true });
-})));
+}));