. ' + 'Read more: https://facebook.github.io/react/docs/more-about-refs.html#the-ref-callback-attribute');
if (!previousRef) {
// When there is no ref on the element, use the new ref directly
return React.cloneElement(element, {
ref: newRef
});
} else {
return React.cloneElement(element, {
ref: function ref(node) {
setRef(previousRef, node);
setRef(newRef, node);
}
});
}
}
function throwIfCompositeComponentElement(element) {
// Custom components can no longer be wrapped directly in React DnD 2.0
// so that we don't need to depend on findDOMNode() from react-dom.
if (typeof element.type === 'string') {
return;
}
var displayName = element.type.displayName || element.type.name || 'the component';
throw new Error('Only native element nodes can now be passed to React DnD connectors.' + "You can either wrap ".concat(displayName, " into a
, or turn it into a ") + 'drag source or a drop target itself.');
}
function wrapHookToRecognizeElement(hook) {
return function () {
var elementOrNode = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
// When passed a node, call the hook straight away.
if (!React.isValidElement(elementOrNode)) {
var node = elementOrNode;
hook(node, options); // return the node so it can be chained (e.g. when within callback refs
//
connectDragSource(connectDropTarget(node))}/>
return node;
} // If passed a ReactElement, clone it and attach this function as a ref.
// This helps us achieve a neat API where user doesn't even know that refs
// are being used under the hood.
var element = elementOrNode;
throwIfCompositeComponentElement(element); // When no options are passed, use the hook directly
var ref = options ? function (node) {
return hook(node, options);
} : hook;
return cloneWithRef(element, ref);
};
}
function wrapConnectorHooks(hooks) {
var wrappedHooks = {};
Object.keys(hooks).forEach(function (key) {
var hook = hooks[key]; // ref objects should be passed straight through without wrapping
if (key.endsWith('Ref')) {
wrappedHooks[key] = hooks[key];
} else {
var wrappedHook = wrapHookToRecognizeElement(hook);
wrappedHooks[key] = function () {
return wrappedHook;
};
}
});
return wrappedHooks;
}
function _typeof$2(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof$2 = function _typeof(obj) { return typeof obj; }; } else { _typeof$2 = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof$2(obj); }
function isRef(obj) {
return (// eslint-disable-next-line no-prototype-builtins
obj !== null && _typeof$2(obj) === 'object' && obj.hasOwnProperty('current')
);
}
function _classCallCheck$4(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _defineProperties$4(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _createClass$4(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties$4(Constructor.prototype, protoProps); if (staticProps) _defineProperties$4(Constructor, staticProps); return Constructor; }
var SourceConnector =
/*#__PURE__*/
function () {
function SourceConnector(backend) {
var _this = this;
_classCallCheck$4(this, SourceConnector);
this.hooks = wrapConnectorHooks({
dragSource: function dragSource(node, options) {
_this.clearDragSource();
_this.dragSourceOptions = options || null;
if (isRef(node)) {
_this.dragSourceRef = node;
} else {
_this.dragSourceNode = node;
}
_this.reconnectDragSource();
},
dragPreview: function dragPreview(node, options) {
_this.clearDragPreview();
_this.dragPreviewOptions = options || null;
if (isRef(node)) {
_this.dragPreviewRef = node;
} else {
_this.dragPreviewNode = node;
}
_this.reconnectDragPreview();
}
});
this.handlerId = null; // The drop target may either be attached via ref or connect function
this.dragSourceRef = null;
this.dragSourceOptionsInternal = null; // The drag preview may either be attached via ref or connect function
this.dragPreviewRef = null;
this.dragPreviewOptionsInternal = null;
this.lastConnectedHandlerId = null;
this.lastConnectedDragSource = null;
this.lastConnectedDragSourceOptions = null;
this.lastConnectedDragPreview = null;
this.lastConnectedDragPreviewOptions = null;
this.backend = backend;
}
_createClass$4(SourceConnector, [{
key: "receiveHandlerId",
value: function receiveHandlerId(newHandlerId) {
if (this.handlerId === newHandlerId) {
return;
}
this.handlerId = newHandlerId;
this.reconnect();
}
}, {
key: "reconnect",
value: function reconnect() {
this.reconnectDragSource();
this.reconnectDragPreview();
}
}, {
key: "reconnectDragSource",
value: function reconnectDragSource() {
var dragSource = this.dragSource; // if nothing has changed then don't resubscribe
var didChange = this.didHandlerIdChange() || this.didConnectedDragSourceChange() || this.didDragSourceOptionsChange();
if (didChange) {
this.disconnectDragSource();
}
if (!this.handlerId) {
return;
}
if (!dragSource) {
this.lastConnectedDragSource = dragSource;
return;
}
if (didChange) {
this.lastConnectedHandlerId = this.handlerId;
this.lastConnectedDragSource = dragSource;
this.lastConnectedDragSourceOptions = this.dragSourceOptions;
this.dragSourceUnsubscribe = this.backend.connectDragSource(this.handlerId, dragSource, this.dragSourceOptions);
}
}
}, {
key: "reconnectDragPreview",
value: function reconnectDragPreview() {
var dragPreview = this.dragPreview; // if nothing has changed then don't resubscribe
var didChange = this.didHandlerIdChange() || this.didConnectedDragPreviewChange() || this.didDragPreviewOptionsChange();
if (!this.handlerId) {
this.disconnectDragPreview();
} else if (this.dragPreview && didChange) {
this.lastConnectedHandlerId = this.handlerId;
this.lastConnectedDragPreview = dragPreview;
this.lastConnectedDragPreviewOptions = this.dragPreviewOptions;
this.disconnectDragPreview();
this.dragPreviewUnsubscribe = this.backend.connectDragPreview(this.handlerId, dragPreview, this.dragPreviewOptions);
}
}
}, {
key: "didHandlerIdChange",
value: function didHandlerIdChange() {
return this.lastConnectedHandlerId !== this.handlerId;
}
}, {
key: "didConnectedDragSourceChange",
value: function didConnectedDragSourceChange() {
return this.lastConnectedDragSource !== this.dragSource;
}
}, {
key: "didConnectedDragPreviewChange",
value: function didConnectedDragPreviewChange() {
return this.lastConnectedDragPreview !== this.dragPreview;
}
}, {
key: "didDragSourceOptionsChange",
value: function didDragSourceOptionsChange() {
return !shallowEqual(this.lastConnectedDragSourceOptions, this.dragSourceOptions);
}
}, {
key: "didDragPreviewOptionsChange",
value: function didDragPreviewOptionsChange() {
return !shallowEqual(this.lastConnectedDragPreviewOptions, this.dragPreviewOptions);
}
}, {
key: "disconnectDragSource",
value: function disconnectDragSource() {
if (this.dragSourceUnsubscribe) {
this.dragSourceUnsubscribe();
this.dragSourceUnsubscribe = undefined;
}
}
}, {
key: "disconnectDragPreview",
value: function disconnectDragPreview() {
if (this.dragPreviewUnsubscribe) {
this.dragPreviewUnsubscribe();
this.dragPreviewUnsubscribe = undefined;
this.dragPreviewNode = null;
this.dragPreviewRef = null;
}
}
}, {
key: "clearDragSource",
value: function clearDragSource() {
this.dragSourceNode = null;
this.dragSourceRef = null;
}
}, {
key: "clearDragPreview",
value: function clearDragPreview() {
this.dragPreviewNode = null;
this.dragPreviewRef = null;
}
}, {
key: "connectTarget",
get: function get() {
return this.dragSource;
}
}, {
key: "dragSourceOptions",
get: function get() {
return this.dragSourceOptionsInternal;
},
set: function set(options) {
this.dragSourceOptionsInternal = options;
}
}, {
key: "dragPreviewOptions",
get: function get() {
return this.dragPreviewOptionsInternal;
},
set: function set(options) {
this.dragPreviewOptionsInternal = options;
}
}, {
key: "dragSource",
get: function get() {
return this.dragSourceNode || this.dragSourceRef && this.dragSourceRef.current;
}
}, {
key: "dragPreview",
get: function get() {
return this.dragPreviewNode || this.dragPreviewRef && this.dragPreviewRef.current;
}
}]);
return SourceConnector;
}();
function _slicedToArray$4(arr, i) { return _arrayWithHoles$4(arr) || _iterableToArrayLimit$4(arr, i) || _nonIterableRest$4(); }
function _nonIterableRest$4() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
function _iterableToArrayLimit$4(arr, i) { if (!(Symbol.iterator in Object(arr) || Object.prototype.toString.call(arr) === "[object Arguments]")) { return; } var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _arrayWithHoles$4(arr) { if (Array.isArray(arr)) return arr; }
function _typeof$3(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof$3 = function _typeof(obj) { return typeof obj; }; } else { _typeof$3 = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof$3(obj); }
function useDragSourceMonitor() {
var manager = useDragDropManager();
var monitor = React.useMemo(function () {
return new DragSourceMonitorImpl(manager);
}, [manager]);
var connector = React.useMemo(function () {
return new SourceConnector(manager.getBackend());
}, [manager]);
return [monitor, connector];
}
function useDragHandler(spec, monitor, connector) {
var manager = useDragDropManager();
var handler = React.useMemo(function () {
return {
beginDrag: function beginDrag() {
var _spec$current = spec.current,
begin = _spec$current.begin,
item = _spec$current.item;
if (begin) {
var beginResult = begin(monitor);
invariant(beginResult == null || _typeof$3(beginResult) === 'object', 'dragSpec.begin() must either return an object, undefined, or null');
return beginResult || item || {};
}
return item || {};
},
canDrag: function canDrag() {
if (typeof spec.current.canDrag === 'boolean') {
return spec.current.canDrag;
} else if (typeof spec.current.canDrag === 'function') {
return spec.current.canDrag(monitor);
} else {
return true;
}
},
isDragging: function isDragging(globalMonitor, target) {
var isDragging = spec.current.isDragging;
return isDragging ? isDragging(monitor) : target === globalMonitor.getSourceId();
},
endDrag: function endDrag() {
var end = spec.current.end;
if (end) {
end(monitor.getItem(), monitor);
}
connector.reconnect();
}
};
}, []);
useIsomorphicLayoutEffect(function registerHandler() {
var _registerSource = registerSource(spec.current.item.type, handler, manager),
_registerSource2 = _slicedToArray$4(_registerSource, 2),
handlerId = _registerSource2[0],
unregister = _registerSource2[1];
monitor.receiveHandlerId(handlerId);
connector.receiveHandlerId(handlerId);
return unregister;
}, []);
}
function _slicedToArray$5(arr, i) { return _arrayWithHoles$5(arr) || _iterableToArrayLimit$5(arr, i) || _nonIterableRest$5(); }
function _nonIterableRest$5() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
function _iterableToArrayLimit$5(arr, i) { if (!(Symbol.iterator in Object(arr) || Object.prototype.toString.call(arr) === "[object Arguments]")) { return; } var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _arrayWithHoles$5(arr) { if (Array.isArray(arr)) return arr; }
/**
* useDragSource hook
* @param sourceSpec The drag source specification *
*/
function useDrag(spec) {
var specRef = React.useRef(spec);
specRef.current = spec; // TODO: wire options into createSourceConnector
invariant(spec.item != null, 'item must be defined');
invariant(spec.item.type != null, 'item type must be defined');
var _useDragSourceMonitor = useDragSourceMonitor(),
_useDragSourceMonitor2 = _slicedToArray$5(_useDragSourceMonitor, 2),
monitor = _useDragSourceMonitor2[0],
connector = _useDragSourceMonitor2[1];
useDragHandler(specRef, monitor, connector);
var result = useMonitorOutput(monitor, specRef.current.collect || function () {
return {};
}, function () {
return connector.reconnect();
});
var connectDragSource = React.useMemo(function () {
return connector.hooks.dragSource();
}, [connector]);
var connectDragPreview = React.useMemo(function () {
return connector.hooks.dragPreview();
}, [connector]);
useIsomorphicLayoutEffect(function () {
connector.dragSourceOptions = specRef.current.options || null;
connector.reconnect();
}, [connector]);
useIsomorphicLayoutEffect(function () {
connector.dragPreviewOptions = specRef.current.previewOptions || null;
connector.reconnect();
}, [connector]);
return [result, connectDragSource, connectDragPreview];
}
function _classCallCheck$5(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _defineProperties$5(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _createClass$5(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties$5(Constructor.prototype, protoProps); if (staticProps) _defineProperties$5(Constructor, staticProps); return Constructor; }
var TargetConnector =
/*#__PURE__*/
function () {
function TargetConnector(backend) {
var _this = this;
_classCallCheck$5(this, TargetConnector);
this.hooks = wrapConnectorHooks({
dropTarget: function dropTarget(node, options) {
_this.clearDropTarget();
_this.dropTargetOptions = options;
if (isRef(node)) {
_this.dropTargetRef = node;
} else {
_this.dropTargetNode = node;
}
_this.reconnect();
}
});
this.handlerId = null; // The drop target may either be attached via ref or connect function
this.dropTargetRef = null;
this.dropTargetOptionsInternal = null;
this.lastConnectedHandlerId = null;
this.lastConnectedDropTarget = null;
this.lastConnectedDropTargetOptions = null;
this.backend = backend;
}
_createClass$5(TargetConnector, [{
key: "reconnect",
value: function reconnect() {
// if nothing has changed then don't resubscribe
var didChange = this.didHandlerIdChange() || this.didDropTargetChange() || this.didOptionsChange();
if (didChange) {
this.disconnectDropTarget();
}
var dropTarget = this.dropTarget;
if (!this.handlerId) {
return;
}
if (!dropTarget) {
this.lastConnectedDropTarget = dropTarget;
return;
}
if (didChange) {
this.lastConnectedHandlerId = this.handlerId;
this.lastConnectedDropTarget = dropTarget;
this.lastConnectedDropTargetOptions = this.dropTargetOptions;
this.unsubscribeDropTarget = this.backend.connectDropTarget(this.handlerId, dropTarget, this.dropTargetOptions);
}
}
}, {
key: "receiveHandlerId",
value: function receiveHandlerId(newHandlerId) {
if (newHandlerId === this.handlerId) {
return;
}
this.handlerId = newHandlerId;
this.reconnect();
}
}, {
key: "didHandlerIdChange",
value: function didHandlerIdChange() {
return this.lastConnectedHandlerId !== this.handlerId;
}
}, {
key: "didDropTargetChange",
value: function didDropTargetChange() {
return this.lastConnectedDropTarget !== this.dropTarget;
}
}, {
key: "didOptionsChange",
value: function didOptionsChange() {
return !shallowEqual(this.lastConnectedDropTargetOptions, this.dropTargetOptions);
}
}, {
key: "disconnectDropTarget",
value: function disconnectDropTarget() {
if (this.unsubscribeDropTarget) {
this.unsubscribeDropTarget();
this.unsubscribeDropTarget = undefined;
}
}
}, {
key: "clearDropTarget",
value: function clearDropTarget() {
this.dropTargetRef = null;
this.dropTargetNode = null;
}
}, {
key: "connectTarget",
get: function get() {
return this.dropTarget;
}
}, {
key: "dropTargetOptions",
get: function get() {
return this.dropTargetOptionsInternal;
},
set: function set(options) {
this.dropTargetOptionsInternal = options;
}
}, {
key: "dropTarget",
get: function get() {
return this.dropTargetNode || this.dropTargetRef && this.dropTargetRef.current;
}
}]);
return TargetConnector;
}();
function _classCallCheck$6(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _defineProperties$6(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _createClass$6(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties$6(Constructor.prototype, protoProps); if (staticProps) _defineProperties$6(Constructor, staticProps); return Constructor; }
var isCallingCanDrop = false;
var DropTargetMonitorImpl =
/*#__PURE__*/
function () {
function DropTargetMonitorImpl(manager) {
_classCallCheck$6(this, DropTargetMonitorImpl);
this.targetId = null;
this.internalMonitor = manager.getMonitor();
}
_createClass$6(DropTargetMonitorImpl, [{
key: "receiveHandlerId",
value: function receiveHandlerId(targetId) {
this.targetId = targetId;
}
}, {
key: "getHandlerId",
value: function getHandlerId() {
return this.targetId;
}
}, {
key: "subscribeToStateChange",
value: function subscribeToStateChange(listener, options) {
return this.internalMonitor.subscribeToStateChange(listener, options);
}
}, {
key: "canDrop",
value: function canDrop() {
// Cut out early if the target id has not been set. This should prevent errors
// where the user has an older version of dnd-core like in
// https://github.com/react-dnd/react-dnd/issues/1310
if (!this.targetId) {
return false;
}
invariant(!isCallingCanDrop, 'You may not call monitor.canDrop() inside your canDrop() implementation. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs/api/drop-target-monitor');
try {
isCallingCanDrop = true;
return this.internalMonitor.canDropOnTarget(this.targetId);
} finally {
isCallingCanDrop = false;
}
}
}, {
key: "isOver",
value: function isOver(options) {
if (!this.targetId) {
return false;
}
return this.internalMonitor.isOverTarget(this.targetId, options);
}
}, {
key: "getItemType",
value: function getItemType() {
return this.internalMonitor.getItemType();
}
}, {
key: "getItem",
value: function getItem() {
return this.internalMonitor.getItem();
}
}, {
key: "getDropResult",
value: function getDropResult() {
return this.internalMonitor.getDropResult();
}
}, {
key: "didDrop",
value: function didDrop() {
return this.internalMonitor.didDrop();
}
}, {
key: "getInitialClientOffset",
value: function getInitialClientOffset() {
return this.internalMonitor.getInitialClientOffset();
}
}, {
key: "getInitialSourceClientOffset",
value: function getInitialSourceClientOffset() {
return this.internalMonitor.getInitialSourceClientOffset();
}
}, {
key: "getSourceClientOffset",
value: function getSourceClientOffset() {
return this.internalMonitor.getSourceClientOffset();
}
}, {
key: "getClientOffset",
value: function getClientOffset() {
return this.internalMonitor.getClientOffset();
}
}, {
key: "getDifferenceFromInitialOffset",
value: function getDifferenceFromInitialOffset() {
return this.internalMonitor.getDifferenceFromInitialOffset();
}
}]);
return DropTargetMonitorImpl;
}();
function _slicedToArray$6(arr, i) { return _arrayWithHoles$6(arr) || _iterableToArrayLimit$6(arr, i) || _nonIterableRest$6(); }
function _nonIterableRest$6() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
function _iterableToArrayLimit$6(arr, i) { if (!(Symbol.iterator in Object(arr) || Object.prototype.toString.call(arr) === "[object Arguments]")) { return; } var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _arrayWithHoles$6(arr) { if (Array.isArray(arr)) return arr; }
function useDropTargetMonitor() {
var manager = useDragDropManager();
var monitor = React.useMemo(function () {
return new DropTargetMonitorImpl(manager);
}, [manager]);
var connector = React.useMemo(function () {
return new TargetConnector(manager.getBackend());
}, [manager]);
return [monitor, connector];
}
function useDropHandler(spec, monitor, connector) {
var manager = useDragDropManager();
var handler = React.useMemo(function () {
return {
canDrop: function canDrop() {
var canDrop = spec.current.canDrop;
return canDrop ? canDrop(monitor.getItem(), monitor) : true;
},
hover: function hover() {
var hover = spec.current.hover;
if (hover) {
hover(monitor.getItem(), monitor);
}
},
drop: function drop() {
var drop = spec.current.drop;
if (drop) {
return drop(monitor.getItem(), monitor);
}
}
};
}, [monitor]);
useIsomorphicLayoutEffect(function registerHandler() {
var _registerTarget = registerTarget(spec.current.accept, handler, manager),
_registerTarget2 = _slicedToArray$6(_registerTarget, 2),
handlerId = _registerTarget2[0],
unregister = _registerTarget2[1];
monitor.receiveHandlerId(handlerId);
connector.receiveHandlerId(handlerId);
return unregister;
}, [monitor, connector]);
}
function _slicedToArray$7(arr, i) { return _arrayWithHoles$7(arr) || _iterableToArrayLimit$7(arr, i) || _nonIterableRest$7(); }
function _nonIterableRest$7() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
function _iterableToArrayLimit$7(arr, i) { if (!(Symbol.iterator in Object(arr) || Object.prototype.toString.call(arr) === "[object Arguments]")) { return; } var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _arrayWithHoles$7(arr) { if (Array.isArray(arr)) return arr; }
/**
* useDropTarget Hook
* @param spec The drop target specification
*/
function useDrop(spec) {
var specRef = React.useRef(spec);
specRef.current = spec;
invariant(spec.accept != null, 'accept must be defined');
var _useDropTargetMonitor = useDropTargetMonitor(),
_useDropTargetMonitor2 = _slicedToArray$7(_useDropTargetMonitor, 2),
monitor = _useDropTargetMonitor2[0],
connector = _useDropTargetMonitor2[1];
useDropHandler(specRef, monitor, connector);
var result = useMonitorOutput(monitor, specRef.current.collect || function () {
return {};
}, function () {
return connector.reconnect();
});
var connectDropTarget = React.useMemo(function () {
return connector.hooks.dropTarget();
}, [connector]);
useIsomorphicLayoutEffect(function () {
connector.dropTargetOptions = spec.options || null;
connector.reconnect();
}, [spec.options]);
return [result, connectDropTarget];
}
function _slicedToArray$8(arr, i) { return _arrayWithHoles$8(arr) || _iterableToArrayLimit$8(arr, i) || _nonIterableRest$8(); }
function _nonIterableRest$8() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
function _iterableToArrayLimit$8(arr, i) { if (!(Symbol.iterator in Object(arr) || Object.prototype.toString.call(arr) === "[object Arguments]")) { return; } var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _arrayWithHoles$8(arr) { if (Array.isArray(arr)) return arr; }
/**
* useDragLayer Hook
* @param collector The property collector
*/
function useDragLayer(collect) {
var dragDropManager = useDragDropManager();
var monitor = dragDropManager.getMonitor();
var _useCollector = useCollector(monitor, collect),
_useCollector2 = _slicedToArray$8(_useCollector, 2),
collected = _useCollector2[0],
updateCollected = _useCollector2[1];
React.useEffect(function () {
return monitor.subscribeToOffsetChange(updateCollected);
});
React.useEffect(function () {
return monitor.subscribeToStateChange(updateCollected);
});
return collected;
}
function _typeof$4(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof$4 = function _typeof(obj) { return typeof obj; }; } else { _typeof$4 = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof$4(obj); }
// cheap lodash replacements
function isFunction(input) {
return typeof input === 'function';
}
function noop() {// noop
}
function isObjectLike(input) {
return _typeof$4(input) === 'object' && input !== null;
}
function isPlainObject$1(input) {
if (!isObjectLike(input)) {
return false;
}
if (Object.getPrototypeOf(input) === null) {
return true;
}
var proto = input;
while (Object.getPrototypeOf(proto) !== null) {
proto = Object.getPrototypeOf(proto);
}
return Object.getPrototypeOf(input) === proto;
}
function getDecoratedComponent(instanceRef) {
var currentRef = instanceRef.current;
if (currentRef == null) {
return null;
} else if (currentRef.decoratedRef) {
// go through the private field in decorateHandler to avoid the invariant hit
return currentRef.decoratedRef.current;
} else {
return currentRef;
}
}
function isClassComponent(Component) {
return Component && Component.prototype && typeof Component.prototype.render === 'function';
}
function isRefForwardingComponent(C) {
return C && C.$$typeof && C.$$typeof.toString() === 'Symbol(react.forward_ref)';
}
function isRefable(C) {
return isClassComponent(C) || isRefForwardingComponent(C);
}
function checkDecoratorArguments(functionName, signature) {
if ("development" !== 'production') {
for (var i = 0; i < (arguments.length <= 2 ? 0 : arguments.length - 2); i++) {
var arg = i + 2 < 2 || arguments.length <= i + 2 ? undefined : arguments[i + 2];
if (arg && arg.prototype && arg.prototype.render) {
// eslint-disable-next-line no-console
console.error('You seem to be applying the arguments in the wrong order. ' + "It should be ".concat(functionName, "(").concat(signature, ")(Component), not the other way around. ") + 'Read more: http://react-dnd.github.io/react-dnd/docs/troubleshooting#you-seem-to-be-applying-the-arguments-in-the-wrong-order');
return;
}
}
}
}
function unwrapExports (x) {
return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
}
function createCommonjsModule(fn, module) {
return module = { exports: {} }, fn(module, module.exports), module.exports;
}
var reactIs_production_min = createCommonjsModule(function (module, exports) {
Object.defineProperty(exports,"__esModule",{value:!0});
var b="function"===typeof Symbol&&Symbol.for,c=b?Symbol.for("react.element"):60103,d=b?Symbol.for("react.portal"):60106,e=b?Symbol.for("react.fragment"):60107,f=b?Symbol.for("react.strict_mode"):60108,g=b?Symbol.for("react.profiler"):60114,h=b?Symbol.for("react.provider"):60109,k=b?Symbol.for("react.context"):60110,l=b?Symbol.for("react.async_mode"):60111,m=b?Symbol.for("react.concurrent_mode"):60111,n=b?Symbol.for("react.forward_ref"):60112,p=b?Symbol.for("react.suspense"):60113,q=b?Symbol.for("react.suspense_list"):
60120,r=b?Symbol.for("react.memo"):60115,t=b?Symbol.for("react.lazy"):60116,v=b?Symbol.for("react.fundamental"):60117,w=b?Symbol.for("react.responder"):60118,x=b?Symbol.for("react.scope"):60119;function y(a){if("object"===typeof a&&null!==a){var u=a.$$typeof;switch(u){case c:switch(a=a.type,a){case l:case m:case e:case g:case f:case p:return a;default:switch(a=a&&a.$$typeof,a){case k:case n:case t:case r:case h:return a;default:return u}}case d:return u}}}function z(a){return y(a)===m}
exports.typeOf=y;exports.AsyncMode=l;exports.ConcurrentMode=m;exports.ContextConsumer=k;exports.ContextProvider=h;exports.Element=c;exports.ForwardRef=n;exports.Fragment=e;exports.Lazy=t;exports.Memo=r;exports.Portal=d;exports.Profiler=g;exports.StrictMode=f;exports.Suspense=p;
exports.isValidElementType=function(a){return "string"===typeof a||"function"===typeof a||a===e||a===m||a===g||a===f||a===p||a===q||"object"===typeof a&&null!==a&&(a.$$typeof===t||a.$$typeof===r||a.$$typeof===h||a.$$typeof===k||a.$$typeof===n||a.$$typeof===v||a.$$typeof===w||a.$$typeof===x)};exports.isAsyncMode=function(a){return z(a)||y(a)===l};exports.isConcurrentMode=z;exports.isContextConsumer=function(a){return y(a)===k};exports.isContextProvider=function(a){return y(a)===h};
exports.isElement=function(a){return "object"===typeof a&&null!==a&&a.$$typeof===c};exports.isForwardRef=function(a){return y(a)===n};exports.isFragment=function(a){return y(a)===e};exports.isLazy=function(a){return y(a)===t};exports.isMemo=function(a){return y(a)===r};exports.isPortal=function(a){return y(a)===d};exports.isProfiler=function(a){return y(a)===g};exports.isStrictMode=function(a){return y(a)===f};exports.isSuspense=function(a){return y(a)===p};
});
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;
var reactIs_development = createCommonjsModule(function (module, exports) {
if ("development" !== "production") {
(function() {
Object.defineProperty(exports, '__esModule', { value: true });
// The Symbol used to tag the ReactElement-like types. If there is no native Symbol
// nor polyfill, then a plain number is used for performance.
var hasSymbol = typeof Symbol === 'function' && Symbol.for;
var REACT_ELEMENT_TYPE = hasSymbol ? Symbol.for('react.element') : 0xeac7;
var REACT_PORTAL_TYPE = hasSymbol ? Symbol.for('react.portal') : 0xeaca;
var REACT_FRAGMENT_TYPE = hasSymbol ? Symbol.for('react.fragment') : 0xeacb;
var REACT_STRICT_MODE_TYPE = hasSymbol ? Symbol.for('react.strict_mode') : 0xeacc;
var REACT_PROFILER_TYPE = hasSymbol ? Symbol.for('react.profiler') : 0xead2;
var REACT_PROVIDER_TYPE = hasSymbol ? Symbol.for('react.provider') : 0xeacd;
var REACT_CONTEXT_TYPE = hasSymbol ? Symbol.for('react.context') : 0xeace; // TODO: We don't use AsyncMode or ConcurrentMode anymore. They were temporary
// (unstable) APIs that have been removed. Can we remove the symbols?
var REACT_ASYNC_MODE_TYPE = hasSymbol ? Symbol.for('react.async_mode') : 0xeacf;
var REACT_CONCURRENT_MODE_TYPE = hasSymbol ? Symbol.for('react.concurrent_mode') : 0xeacf;
var REACT_FORWARD_REF_TYPE = hasSymbol ? Symbol.for('react.forward_ref') : 0xead0;
var REACT_SUSPENSE_TYPE = hasSymbol ? Symbol.for('react.suspense') : 0xead1;
var REACT_SUSPENSE_LIST_TYPE = hasSymbol ? Symbol.for('react.suspense_list') : 0xead8;
var REACT_MEMO_TYPE = hasSymbol ? Symbol.for('react.memo') : 0xead3;
var REACT_LAZY_TYPE = hasSymbol ? Symbol.for('react.lazy') : 0xead4;
var REACT_FUNDAMENTAL_TYPE = hasSymbol ? Symbol.for('react.fundamental') : 0xead5;
var REACT_RESPONDER_TYPE = hasSymbol ? Symbol.for('react.responder') : 0xead6;
var REACT_SCOPE_TYPE = hasSymbol ? Symbol.for('react.scope') : 0xead7;
function isValidElementType(type) {
return typeof type === 'string' || typeof type === 'function' || // Note: its typeof might be other than 'symbol' or 'number' if it's a polyfill.
type === REACT_FRAGMENT_TYPE || type === REACT_CONCURRENT_MODE_TYPE || type === REACT_PROFILER_TYPE || type === REACT_STRICT_MODE_TYPE || type === REACT_SUSPENSE_TYPE || type === REACT_SUSPENSE_LIST_TYPE || typeof type === 'object' && type !== null && (type.$$typeof === REACT_LAZY_TYPE || type.$$typeof === REACT_MEMO_TYPE || type.$$typeof === REACT_PROVIDER_TYPE || type.$$typeof === REACT_CONTEXT_TYPE || type.$$typeof === REACT_FORWARD_REF_TYPE || type.$$typeof === REACT_FUNDAMENTAL_TYPE || type.$$typeof === REACT_RESPONDER_TYPE || type.$$typeof === REACT_SCOPE_TYPE);
}
/**
* Forked from fbjs/warning:
* https://github.com/facebook/fbjs/blob/e66ba20ad5be433eb54423f2b097d829324d9de6/packages/fbjs/src/__forks__/warning.js
*
* Only change is we use console.warn instead of console.error,
* and do nothing when 'console' is not supported.
* This really simplifies the code.
* ---
* Similar to invariant but only logs a warning if the condition is not met.
* This can be used to log issues in development environments in critical
* paths. Removing the logging code for production environments will keep the
* same logic and follow the same code paths.
*/
var lowPriorityWarningWithoutStack = function () {};
{
var printWarning = function (format) {
for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
args[_key - 1] = arguments[_key];
}
var argIndex = 0;
var message = 'Warning: ' + format.replace(/%s/g, function () {
return args[argIndex++];
});
if (typeof console !== 'undefined') {
console.warn(message);
}
try {
// --- Welcome to debugging React ---
// This error was thrown as a convenience so that you can use this stack
// to find the callsite that caused this warning to fire.
throw new Error(message);
} catch (x) {}
};
lowPriorityWarningWithoutStack = function (condition, format) {
if (format === undefined) {
throw new Error('`lowPriorityWarningWithoutStack(condition, format, ...args)` requires a warning ' + 'message argument');
}
if (!condition) {
for (var _len2 = arguments.length, args = new Array(_len2 > 2 ? _len2 - 2 : 0), _key2 = 2; _key2 < _len2; _key2++) {
args[_key2 - 2] = arguments[_key2];
}
printWarning.apply(void 0, [format].concat(args));
}
};
}
var lowPriorityWarningWithoutStack$1 = lowPriorityWarningWithoutStack;
function typeOf(object) {
if (typeof object === 'object' && object !== null) {
var $$typeof = object.$$typeof;
switch ($$typeof) {
case REACT_ELEMENT_TYPE:
var type = object.type;
switch (type) {
case REACT_ASYNC_MODE_TYPE:
case REACT_CONCURRENT_MODE_TYPE:
case REACT_FRAGMENT_TYPE:
case REACT_PROFILER_TYPE:
case REACT_STRICT_MODE_TYPE:
case REACT_SUSPENSE_TYPE:
return type;
default:
var $$typeofType = type && type.$$typeof;
switch ($$typeofType) {
case REACT_CONTEXT_TYPE:
case REACT_FORWARD_REF_TYPE:
case REACT_LAZY_TYPE:
case REACT_MEMO_TYPE:
case REACT_PROVIDER_TYPE:
return $$typeofType;
default:
return $$typeof;
}
}
case REACT_PORTAL_TYPE:
return $$typeof;
}
}
return undefined;
} // AsyncMode is deprecated along with isAsyncMode
var AsyncMode = REACT_ASYNC_MODE_TYPE;
var ConcurrentMode = REACT_CONCURRENT_MODE_TYPE;
var ContextConsumer = REACT_CONTEXT_TYPE;
var ContextProvider = REACT_PROVIDER_TYPE;
var Element = REACT_ELEMENT_TYPE;
var ForwardRef = REACT_FORWARD_REF_TYPE;
var Fragment = REACT_FRAGMENT_TYPE;
var Lazy = REACT_LAZY_TYPE;
var Memo = REACT_MEMO_TYPE;
var Portal = REACT_PORTAL_TYPE;
var Profiler = REACT_PROFILER_TYPE;
var StrictMode = REACT_STRICT_MODE_TYPE;
var Suspense = REACT_SUSPENSE_TYPE;
var hasWarnedAboutDeprecatedIsAsyncMode = false; // AsyncMode should be deprecated
function isAsyncMode(object) {
{
if (!hasWarnedAboutDeprecatedIsAsyncMode) {
hasWarnedAboutDeprecatedIsAsyncMode = true;
lowPriorityWarningWithoutStack$1(false, 'The ReactIs.isAsyncMode() alias has been deprecated, ' + 'and will be removed in React 17+. Update your code to use ' + 'ReactIs.isConcurrentMode() instead. It has the exact same API.');
}
}
return isConcurrentMode(object) || typeOf(object) === REACT_ASYNC_MODE_TYPE;
}
function isConcurrentMode(object) {
return typeOf(object) === REACT_CONCURRENT_MODE_TYPE;
}
function isContextConsumer(object) {
return typeOf(object) === REACT_CONTEXT_TYPE;
}
function isContextProvider(object) {
return typeOf(object) === REACT_PROVIDER_TYPE;
}
function isElement(object) {
return typeof object === 'object' && object !== null && object.$$typeof === REACT_ELEMENT_TYPE;
}
function isForwardRef(object) {
return typeOf(object) === REACT_FORWARD_REF_TYPE;
}
function isFragment(object) {
return typeOf(object) === REACT_FRAGMENT_TYPE;
}
function isLazy(object) {
return typeOf(object) === REACT_LAZY_TYPE;
}
function isMemo(object) {
return typeOf(object) === REACT_MEMO_TYPE;
}
function isPortal(object) {
return typeOf(object) === REACT_PORTAL_TYPE;
}
function isProfiler(object) {
return typeOf(object) === REACT_PROFILER_TYPE;
}
function isStrictMode(object) {
return typeOf(object) === REACT_STRICT_MODE_TYPE;
}
function isSuspense(object) {
return typeOf(object) === REACT_SUSPENSE_TYPE;
}
exports.typeOf = typeOf;
exports.AsyncMode = AsyncMode;
exports.ConcurrentMode = ConcurrentMode;
exports.ContextConsumer = ContextConsumer;
exports.ContextProvider = ContextProvider;
exports.Element = Element;
exports.ForwardRef = ForwardRef;
exports.Fragment = Fragment;
exports.Lazy = Lazy;
exports.Memo = Memo;
exports.Portal = Portal;
exports.Profiler = Profiler;
exports.StrictMode = StrictMode;
exports.Suspense = Suspense;
exports.isValidElementType = isValidElementType;
exports.isAsyncMode = isAsyncMode;
exports.isConcurrentMode = isConcurrentMode;
exports.isContextConsumer = isContextConsumer;
exports.isContextProvider = isContextProvider;
exports.isElement = isElement;
exports.isForwardRef = isForwardRef;
exports.isFragment = isFragment;
exports.isLazy = isLazy;
exports.isMemo = isMemo;
exports.isPortal = isPortal;
exports.isProfiler = isProfiler;
exports.isStrictMode = isStrictMode;
exports.isSuspense = isSuspense;
})();
}
});
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;
var reactIs = createCommonjsModule(function (module) {
if ("development" === 'production') {
module.exports = reactIs_production_min;
} else {
module.exports = reactIs_development;
}
});
/**
* Copyright 2015, Yahoo! Inc.
* Copyrights licensed under the New BSD License. See the accompanying LICENSE file for terms.
*/
var REACT_STATICS = {
childContextTypes: true,
contextType: true,
contextTypes: true,
defaultProps: true,
displayName: true,
getDefaultProps: true,
getDerivedStateFromError: true,
getDerivedStateFromProps: true,
mixins: true,
propTypes: true,
type: true
};
var KNOWN_STATICS = {
name: true,
length: true,
prototype: true,
caller: true,
callee: true,
arguments: true,
arity: true
};
var FORWARD_REF_STATICS = {
'$$typeof': true,
render: true,
defaultProps: true,
displayName: true,
propTypes: true
};
var MEMO_STATICS = {
'$$typeof': true,
compare: true,
defaultProps: true,
displayName: true,
propTypes: true,
type: true
};
var TYPE_STATICS = {};
TYPE_STATICS[reactIs.ForwardRef] = FORWARD_REF_STATICS;
function getStatics(component) {
if (reactIs.isMemo(component)) {
return MEMO_STATICS;
}
return TYPE_STATICS[component['$$typeof']] || REACT_STATICS;
}
var defineProperty = Object.defineProperty;
var getOwnPropertyNames = Object.getOwnPropertyNames;
var getOwnPropertySymbols = Object.getOwnPropertySymbols;
var getOwnPropertyDescriptor = Object.getOwnPropertyDescriptor;
var getPrototypeOf = Object.getPrototypeOf;
var objectPrototype = Object.prototype;
function hoistNonReactStatics(targetComponent, sourceComponent, blacklist) {
if (typeof sourceComponent !== 'string') {
// don't hoist over string (html) components
if (objectPrototype) {
var inheritedComponent = getPrototypeOf(sourceComponent);
if (inheritedComponent && inheritedComponent !== objectPrototype) {
hoistNonReactStatics(targetComponent, inheritedComponent, blacklist);
}
}
var keys = getOwnPropertyNames(sourceComponent);
if (getOwnPropertySymbols) {
keys = keys.concat(getOwnPropertySymbols(sourceComponent));
}
var targetStatics = getStatics(targetComponent);
var sourceStatics = getStatics(sourceComponent);
for (var i = 0; i < keys.length; ++i) {
var key = keys[i];
if (!KNOWN_STATICS[key] && !(blacklist && blacklist[key]) && !(sourceStatics && sourceStatics[key]) && !(targetStatics && targetStatics[key])) {
var descriptor = getOwnPropertyDescriptor(sourceComponent, key);
try {
// Avoid failures from read-only properties
defineProperty(targetComponent, key, descriptor);
} catch (e) {}
}
}
}
return targetComponent;
}
var hoistNonReactStatics_cjs = hoistNonReactStatics;
function _classCallCheck$7(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _defineProperties$7(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _createClass$7(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties$7(Constructor.prototype, protoProps); if (staticProps) _defineProperties$7(Constructor, staticProps); return Constructor; }
/**
* Provides a set of static methods for creating Disposables.
* @param {Function} action Action to run during the first call to dispose.
* The action is guaranteed to be run at most once.
*/
var Disposable =
/*#__PURE__*/
function () {
function Disposable(action) {
_classCallCheck$7(this, Disposable);
this.isDisposed = false;
this.action = isFunction(action) ? action : noop;
}
/**
* Validates whether the given object is a disposable
* @param {Object} Object to test whether it has a dispose method
* @returns {Boolean} true if a disposable object, else false.
*/
_createClass$7(Disposable, [{
key: "dispose",
/** Performs the task of cleaning up resources. */
value: function dispose() {
if (!this.isDisposed) {
this.action();
this.isDisposed = true;
}
}
}], [{
key: "isDisposable",
value: function isDisposable(d) {
return d && isFunction(d.dispose);
}
}, {
key: "_fixup",
value: function _fixup(result) {
return Disposable.isDisposable(result) ? result : Disposable.empty;
}
/**
* Creates a disposable object that invokes the specified action when disposed.
* @param {Function} dispose Action to run during the first call to dispose.
* The action is guaranteed to be run at most once.
* @return {Disposable} The disposable object that runs the given action upon disposal.
*/
}, {
key: "create",
value: function create(action) {
return new Disposable(action);
}
}]);
return Disposable;
}();
/**
* Gets the disposable that does nothing when disposed.
*/
Disposable.empty = {
dispose: noop
};
/**
* Represents a group of disposable resources that are disposed together.
* @constructor
*/
var CompositeDisposable =
/*#__PURE__*/
function () {
function CompositeDisposable() {
_classCallCheck$7(this, CompositeDisposable);
this.isDisposed = false;
for (var _len = arguments.length, disposables = new Array(_len), _key = 0; _key < _len; _key++) {
disposables[_key] = arguments[_key];
}
this.disposables = disposables;
}
/**
* Adds a disposable to the CompositeDisposable or disposes the disposable if the CompositeDisposable is disposed.
* @param {Any} item Disposable to add.
*/
_createClass$7(CompositeDisposable, [{
key: "add",
value: function add(item) {
if (this.isDisposed) {
item.dispose();
} else {
this.disposables.push(item);
}
}
/**
* Removes and disposes the first occurrence of a disposable from the CompositeDisposable.
* @param {Any} item Disposable to remove.
* @returns {Boolean} true if found; false otherwise.
*/
}, {
key: "remove",
value: function remove(item) {
var shouldDispose = false;
if (!this.isDisposed) {
var idx = this.disposables.indexOf(item);
if (idx !== -1) {
shouldDispose = true;
this.disposables.splice(idx, 1);
item.dispose();
}
}
return shouldDispose;
}
/**
* Disposes all disposables in the group and removes them from the group but
* does not dispose the CompositeDisposable.
*/
}, {
key: "clear",
value: function clear() {
if (!this.isDisposed) {
var len = this.disposables.length;
var currentDisposables = new Array(len);
for (var i = 0; i < len; i++) {
currentDisposables[i] = this.disposables[i];
}
this.disposables = [];
for (var _i = 0; _i < len; _i++) {
currentDisposables[_i].dispose();
}
}
}
/**
* Disposes all disposables in the group and removes them from the group.
*/
}, {
key: "dispose",
value: function dispose() {
if (!this.isDisposed) {
this.isDisposed = true;
var len = this.disposables.length;
var currentDisposables = new Array(len);
for (var i = 0; i < len; i++) {
currentDisposables[i] = this.disposables[i];
}
this.disposables = [];
for (var _i2 = 0; _i2 < len; _i2++) {
currentDisposables[_i2].dispose();
}
}
}
}]);
return CompositeDisposable;
}();
/**
* Represents a disposable resource whose underlying disposable resource can
* be replaced by another disposable resource, causing automatic disposal of
* the previous underlying disposable resource.
*/
var SerialDisposable =
/*#__PURE__*/
function () {
function SerialDisposable() {
_classCallCheck$7(this, SerialDisposable);
this.isDisposed = false;
}
/**
* Gets the underlying disposable.
* @returns {Any} the underlying disposable.
*/
_createClass$7(SerialDisposable, [{
key: "getDisposable",
value: function getDisposable() {
return this.current;
}
}, {
key: "setDisposable",
value: function setDisposable(value) {
var shouldDispose = this.isDisposed;
if (!shouldDispose) {
var old = this.current;
this.current = value;
if (old) {
old.dispose();
}
}
if (shouldDispose && value) {
value.dispose();
}
}
/** Performs the task of cleaning up resources. */
}, {
key: "dispose",
value: function dispose() {
if (!this.isDisposed) {
this.isDisposed = true;
var old = this.current;
this.current = undefined;
if (old) {
old.dispose();
}
}
}
}]);
return SerialDisposable;
}();
function _typeof$5(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof$5 = function _typeof(obj) { return typeof obj; }; } else { _typeof$5 = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof$5(obj); }
function _slicedToArray$9(arr, i) { return _arrayWithHoles$9(arr) || _iterableToArrayLimit$9(arr, i) || _nonIterableRest$9(); }
function _nonIterableRest$9() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
function _iterableToArrayLimit$9(arr, i) { if (!(Symbol.iterator in Object(arr) || Object.prototype.toString.call(arr) === "[object Arguments]")) { return; } var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _arrayWithHoles$9(arr) { if (Array.isArray(arr)) return arr; }
function _classCallCheck$8(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _defineProperties$8(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _createClass$8(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties$8(Constructor.prototype, protoProps); if (staticProps) _defineProperties$8(Constructor, staticProps); return Constructor; }
function _possibleConstructorReturn(self, call) { if (call && (_typeof$5(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
function decorateHandler(_ref) {
var DecoratedComponent = _ref.DecoratedComponent,
createHandler = _ref.createHandler,
createMonitor = _ref.createMonitor,
createConnector = _ref.createConnector,
registerHandler = _ref.registerHandler,
containerDisplayName = _ref.containerDisplayName,
getType = _ref.getType,
collect = _ref.collect,
options = _ref.options;
var _options$arePropsEqua = options.arePropsEqual,
arePropsEqual = _options$arePropsEqua === void 0 ? shallowEqual : _options$arePropsEqua;
var Decorated = DecoratedComponent;
var displayName = DecoratedComponent.displayName || DecoratedComponent.name || 'Component';
var DragDropContainer =
/*#__PURE__*/
function (_React$Component) {
_inherits(DragDropContainer, _React$Component);
function DragDropContainer(props) {
var _this;
_classCallCheck$8(this, DragDropContainer);
_this = _possibleConstructorReturn(this, _getPrototypeOf(DragDropContainer).call(this, props));
_this.decoratedRef = React.createRef();
_this.handleChange = function () {
var nextState = _this.getCurrentState();
if (!shallowEqual(nextState, _this.state)) {
_this.setState(nextState);
}
};
_this.disposable = new SerialDisposable();
_this.receiveProps(props);
_this.dispose();
return _this;
}
_createClass$8(DragDropContainer, [{
key: "getHandlerId",
value: function getHandlerId() {
return this.handlerId;
}
}, {
key: "getDecoratedComponentInstance",
value: function getDecoratedComponentInstance() {
invariant(this.decoratedRef.current, 'In order to access an instance of the decorated component, it must either be a class component or use React.forwardRef()');
return this.decoratedRef.current;
}
}, {
key: "shouldComponentUpdate",
value: function shouldComponentUpdate(nextProps, nextState) {
return !arePropsEqual(nextProps, this.props) || !shallowEqual(nextState, this.state);
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
this.disposable = new SerialDisposable();
this.currentType = undefined;
this.receiveProps(this.props);
this.handleChange();
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
if (!arePropsEqual(this.props, prevProps)) {
this.receiveProps(this.props);
this.handleChange();
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
this.dispose();
}
}, {
key: "receiveProps",
value: function receiveProps(props) {
if (!this.handler) {
return;
}
this.handler.receiveProps(props);
this.receiveType(getType(props));
}
}, {
key: "receiveType",
value: function receiveType(type) {
if (!this.handlerMonitor || !this.manager || !this.handlerConnector) {
return;
}
if (type === this.currentType) {
return;
}
this.currentType = type;
var _registerHandler = registerHandler(type, this.handler, this.manager),
_registerHandler2 = _slicedToArray$9(_registerHandler, 2),
handlerId = _registerHandler2[0],
unregister = _registerHandler2[1];
this.handlerId = handlerId;
this.handlerMonitor.receiveHandlerId(handlerId);
this.handlerConnector.receiveHandlerId(handlerId);
var globalMonitor = this.manager.getMonitor();
var unsubscribe = globalMonitor.subscribeToStateChange(this.handleChange, {
handlerIds: [handlerId]
});
this.disposable.setDisposable(new CompositeDisposable(new Disposable(unsubscribe), new Disposable(unregister)));
}
}, {
key: "dispose",
value: function dispose() {
this.disposable.dispose();
if (this.handlerConnector) {
this.handlerConnector.receiveHandlerId(null);
}
}
}, {
key: "getCurrentState",
value: function getCurrentState() {
if (!this.handlerConnector) {
return {};
}
var nextState = collect(this.handlerConnector.hooks, this.handlerMonitor, this.props);
if ("development" !== 'production') {
invariant(isPlainObject$1(nextState), 'Expected `collect` specified as the second argument to ' + '%s for %s to return a plain object of props to inject. ' + 'Instead, received %s.', containerDisplayName, displayName, nextState);
}
return nextState;
}
}, {
key: "render",
value: function render() {
var _this2 = this;
return React.createElement(DndContext.Consumer, null, function (_ref2) {
var dragDropManager = _ref2.dragDropManager;
_this2.receiveDragDropManager(dragDropManager);
if (typeof requestAnimationFrame !== 'undefined') {
requestAnimationFrame(function () {
return _this2.handlerConnector.reconnect();
});
}
return React.createElement(Decorated, Object.assign({}, _this2.props, _this2.getCurrentState(), {
// NOTE: if Decorated is a Function Component, decoratedRef will not be populated unless it's a refforwarding component.
ref: isRefable(Decorated) ? _this2.decoratedRef : null
}));
});
}
}, {
key: "receiveDragDropManager",
value: function receiveDragDropManager(dragDropManager) {
if (this.manager !== undefined) {
return;
}
invariant(dragDropManager !== undefined, 'Could not find the drag and drop manager in the context of %s. ' + 'Make sure to render a DndProvider component in your top-level component. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs/troubleshooting#could-not-find-the-drag-and-drop-manager-in-the-context', displayName, displayName);
if (dragDropManager === undefined) {
return;
}
this.manager = dragDropManager;
this.handlerMonitor = createMonitor(dragDropManager);
this.handlerConnector = createConnector(dragDropManager.getBackend());
this.handler = createHandler(this.handlerMonitor, this.decoratedRef);
}
}]);
return DragDropContainer;
}(React.Component);
DragDropContainer.DecoratedComponent = DecoratedComponent;
DragDropContainer.displayName = "".concat(containerDisplayName, "(").concat(displayName, ")");
return hoistNonReactStatics_cjs(DragDropContainer, DecoratedComponent);
}
function _typeof$6(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof$6 = function _typeof(obj) { return typeof obj; }; } else { _typeof$6 = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof$6(obj); }
function isValidType(type, allowArray) {
return typeof type === 'string' || _typeof$6(type) === 'symbol' || !!allowArray && Array.isArray(type) && type.every(function (t) {
return isValidType(t, false);
});
}
function _classCallCheck$9(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _defineProperties$9(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _createClass$9(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties$9(Constructor.prototype, protoProps); if (staticProps) _defineProperties$9(Constructor, staticProps); return Constructor; }
var ALLOWED_SPEC_METHODS = ['canDrag', 'beginDrag', 'isDragging', 'endDrag'];
var REQUIRED_SPEC_METHODS = ['beginDrag'];
var SourceImpl =
/*#__PURE__*/
function () {
function SourceImpl(spec, monitor, ref) {
var _this = this;
_classCallCheck$9(this, SourceImpl);
this.props = null;
this.beginDrag = function () {
if (!_this.props) {
return;
}
var item = _this.spec.beginDrag(_this.props, _this.monitor, _this.ref.current);
if ("development" !== 'production') {
invariant(isPlainObject$1(item), 'beginDrag() must return a plain object that represents the dragged item. ' + 'Instead received %s. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs/api/drag-source', item);
}
return item;
};
this.spec = spec;
this.monitor = monitor;
this.ref = ref;
}
_createClass$9(SourceImpl, [{
key: "receiveProps",
value: function receiveProps(props) {
this.props = props;
}
}, {
key: "canDrag",
value: function canDrag() {
if (!this.props) {
return false;
}
if (!this.spec.canDrag) {
return true;
}
return this.spec.canDrag(this.props, this.monitor);
}
}, {
key: "isDragging",
value: function isDragging(globalMonitor, sourceId) {
if (!this.props) {
return false;
}
if (!this.spec.isDragging) {
return sourceId === globalMonitor.getSourceId();
}
return this.spec.isDragging(this.props, this.monitor);
}
}, {
key: "endDrag",
value: function endDrag() {
if (!this.props) {
return;
}
if (!this.spec.endDrag) {
return;
}
this.spec.endDrag(this.props, this.monitor, getDecoratedComponent(this.ref));
}
}]);
return SourceImpl;
}();
function createSourceFactory(spec) {
Object.keys(spec).forEach(function (key) {
invariant(ALLOWED_SPEC_METHODS.indexOf(key) > -1, 'Expected the drag source specification to only have ' + 'some of the following keys: %s. ' + 'Instead received a specification with an unexpected "%s" key. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs/api/drag-source', ALLOWED_SPEC_METHODS.join(', '), key);
invariant(typeof spec[key] === 'function', 'Expected %s in the drag source specification to be a function. ' + 'Instead received a specification with %s: %s. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs/api/drag-source', key, key, spec[key]);
});
REQUIRED_SPEC_METHODS.forEach(function (key) {
invariant(typeof spec[key] === 'function', 'Expected %s in the drag source specification to be a function. ' + 'Instead received a specification with %s: %s. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs/api/drag-source', key, key, spec[key]);
});
return function createSource(monitor, ref) {
return new SourceImpl(spec, monitor, ref);
};
}
/**
* Decorates a component as a dragsource
* @param type The dragsource type
* @param spec The drag source specification
* @param collect The props collector function
* @param options DnD options
*/
function DragSource(type, spec, collect) {
var options = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};
checkDecoratorArguments('DragSource', 'type, spec, collect[, options]', type, spec, collect, options);
var getType = type;
if (typeof type !== 'function') {
invariant(isValidType(type), 'Expected "type" provided as the first argument to DragSource to be ' + 'a string, or a function that returns a string given the current props. ' + 'Instead, received %s. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs/api/drag-source', type);
getType = function getType() {
return type;
};
}
invariant(isPlainObject$1(spec), 'Expected "spec" provided as the second argument to DragSource to be ' + 'a plain object. Instead, received %s. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs/api/drag-source', spec);
var createSource = createSourceFactory(spec);
invariant(typeof collect === 'function', 'Expected "collect" provided as the third argument to DragSource to be ' + 'a function that returns a plain object of props to inject. ' + 'Instead, received %s. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs/api/drag-source', collect);
invariant(isPlainObject$1(options), 'Expected "options" provided as the fourth argument to DragSource to be ' + 'a plain object when specified. ' + 'Instead, received %s. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs/api/drag-source', collect);
return function decorateSource(DecoratedComponent) {
return decorateHandler({
containerDisplayName: 'DragSource',
createHandler: createSource,
registerHandler: registerSource,
createConnector: function createConnector(backend) {
return new SourceConnector(backend);
},
createMonitor: function createMonitor(manager) {
return new DragSourceMonitorImpl(manager);
},
DecoratedComponent: DecoratedComponent,
getType: getType,
collect: collect,
options: options
});
};
}
function _classCallCheck$a(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _defineProperties$a(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _createClass$a(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties$a(Constructor.prototype, protoProps); if (staticProps) _defineProperties$a(Constructor, staticProps); return Constructor; }
var ALLOWED_SPEC_METHODS$1 = ['canDrop', 'hover', 'drop'];
var TargetImpl =
/*#__PURE__*/
function () {
function TargetImpl(spec, monitor, ref) {
_classCallCheck$a(this, TargetImpl);
this.props = null;
this.spec = spec;
this.monitor = monitor;
this.ref = ref;
}
_createClass$a(TargetImpl, [{
key: "receiveProps",
value: function receiveProps(props) {
this.props = props;
}
}, {
key: "receiveMonitor",
value: function receiveMonitor(monitor) {
this.monitor = monitor;
}
}, {
key: "canDrop",
value: function canDrop() {
if (!this.spec.canDrop) {
return true;
}
return this.spec.canDrop(this.props, this.monitor);
}
}, {
key: "hover",
value: function hover() {
if (!this.spec.hover) {
return;
}
this.spec.hover(this.props, this.monitor, getDecoratedComponent(this.ref));
}
}, {
key: "drop",
value: function drop() {
if (!this.spec.drop) {
return undefined;
}
var dropResult = this.spec.drop(this.props, this.monitor, this.ref.current);
if ("development" !== 'production') {
invariant(typeof dropResult === 'undefined' || isPlainObject$1(dropResult), 'drop() must either return undefined, or an object that represents the drop result. ' + 'Instead received %s. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs/api/drop-target', dropResult);
}
return dropResult;
}
}]);
return TargetImpl;
}();
function createTargetFactory(spec) {
Object.keys(spec).forEach(function (key) {
invariant(ALLOWED_SPEC_METHODS$1.indexOf(key) > -1, 'Expected the drop target specification to only have ' + 'some of the following keys: %s. ' + 'Instead received a specification with an unexpected "%s" key. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs/api/drop-target', ALLOWED_SPEC_METHODS$1.join(', '), key);
invariant(typeof spec[key] === 'function', 'Expected %s in the drop target specification to be a function. ' + 'Instead received a specification with %s: %s. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs/api/drop-target', key, key, spec[key]);
});
return function createTarget(monitor, ref) {
return new TargetImpl(spec, monitor, ref);
};
}
function DropTarget(type, spec, collect) {
var options = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};
checkDecoratorArguments('DropTarget', 'type, spec, collect[, options]', type, spec, collect, options);
var getType = type;
if (typeof type !== 'function') {
invariant(isValidType(type, true), 'Expected "type" provided as the first argument to DropTarget to be ' + 'a string, an array of strings, or a function that returns either given ' + 'the current props. Instead, received %s. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs/api/drop-target', type);
getType = function getType() {
return type;
};
}
invariant(isPlainObject$1(spec), 'Expected "spec" provided as the second argument to DropTarget to be ' + 'a plain object. Instead, received %s. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs/api/drop-target', spec);
var createTarget = createTargetFactory(spec);
invariant(typeof collect === 'function', 'Expected "collect" provided as the third argument to DropTarget to be ' + 'a function that returns a plain object of props to inject. ' + 'Instead, received %s. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs/api/drop-target', collect);
invariant(isPlainObject$1(options), 'Expected "options" provided as the fourth argument to DropTarget to be ' + 'a plain object when specified. ' + 'Instead, received %s. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs/api/drop-target', collect);
return function decorateTarget(DecoratedComponent) {
return decorateHandler({
containerDisplayName: 'DropTarget',
createHandler: createTarget,
registerHandler: registerTarget,
createMonitor: function createMonitor(manager) {
return new DropTargetMonitorImpl(manager);
},
createConnector: function createConnector(backend) {
return new TargetConnector(backend);
},
DecoratedComponent: DecoratedComponent,
getType: getType,
collect: collect,
options: options
});
};
}
function _typeof$7(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof$7 = function _typeof(obj) { return typeof obj; }; } else { _typeof$7 = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof$7(obj); }
function _classCallCheck$b(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _defineProperties$b(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _createClass$b(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties$b(Constructor.prototype, protoProps); if (staticProps) _defineProperties$b(Constructor, staticProps); return Constructor; }
function _possibleConstructorReturn$1(self, call) { if (call && (_typeof$7(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized$1(self); }
function _assertThisInitialized$1(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
function _getPrototypeOf$1(o) { _getPrototypeOf$1 = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf$1(o); }
function _inherits$1(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf$1(subClass, superClass); }
function _setPrototypeOf$1(o, p) { _setPrototypeOf$1 = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf$1(o, p); }
function DragLayer(collect) {
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
checkDecoratorArguments('DragLayer', 'collect[, options]', collect, options);
invariant(typeof collect === 'function', 'Expected "collect" provided as the first argument to DragLayer to be a function that collects props to inject into the component. ', 'Instead, received %s. Read more: http://react-dnd.github.io/react-dnd/docs/api/drag-layer', collect);
invariant(isPlainObject$1(options), 'Expected "options" provided as the second argument to DragLayer to be a plain object when specified. ' + 'Instead, received %s. Read more: http://react-dnd.github.io/react-dnd/docs/api/drag-layer', options);
return function decorateLayer(DecoratedComponent) {
var Decorated = DecoratedComponent;
var _options$arePropsEqua = options.arePropsEqual,
arePropsEqual = _options$arePropsEqua === void 0 ? shallowEqual : _options$arePropsEqua;
var displayName = Decorated.displayName || Decorated.name || 'Component';
var DragLayerContainer =
/*#__PURE__*/
function (_React$Component) {
_inherits$1(DragLayerContainer, _React$Component);
function DragLayerContainer() {
var _this;
_classCallCheck$b(this, DragLayerContainer);
_this = _possibleConstructorReturn$1(this, _getPrototypeOf$1(DragLayerContainer).apply(this, arguments));
_this.isCurrentlyMounted = false;
_this.ref = React.createRef();
_this.handleChange = function () {
if (!_this.isCurrentlyMounted) {
return;
}
var nextState = _this.getCurrentState();
if (!shallowEqual(nextState, _this.state)) {
_this.setState(nextState);
}
};
return _this;
}
_createClass$b(DragLayerContainer, [{
key: "getDecoratedComponentInstance",
value: function getDecoratedComponentInstance() {
invariant(this.ref.current, 'In order to access an instance of the decorated component, it must either be a class component or use React.forwardRef()');
return this.ref.current;
}
}, {
key: "shouldComponentUpdate",
value: function shouldComponentUpdate(nextProps, nextState) {
return !arePropsEqual(nextProps, this.props) || !shallowEqual(nextState, this.state);
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
this.isCurrentlyMounted = true;
this.handleChange();
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
this.isCurrentlyMounted = false;
if (this.unsubscribeFromOffsetChange) {
this.unsubscribeFromOffsetChange();
this.unsubscribeFromOffsetChange = undefined;
}
if (this.unsubscribeFromStateChange) {
this.unsubscribeFromStateChange();
this.unsubscribeFromStateChange = undefined;
}
}
}, {
key: "render",
value: function render() {
var _this2 = this;
return React.createElement(DndContext.Consumer, null, function (_ref) {
var dragDropManager = _ref.dragDropManager;
if (dragDropManager === undefined) {
return null;
}
_this2.receiveDragDropManager(dragDropManager); // Let componentDidMount fire to initialize the collected state
if (!_this2.isCurrentlyMounted) {
return null;
}
return React.createElement(Decorated, Object.assign({}, _this2.props, _this2.state, {
ref: isRefable(Decorated) ? _this2.ref : null
}));
});
}
}, {
key: "receiveDragDropManager",
value: function receiveDragDropManager(dragDropManager) {
if (this.manager !== undefined) {
return;
}
this.manager = dragDropManager;
invariant(_typeof$7(dragDropManager) === 'object', 'Could not find the drag and drop manager in the context of %s. ' + 'Make sure to render a DndProvider component in your top-level component. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs/troubleshooting#could-not-find-the-drag-and-drop-manager-in-the-context', displayName, displayName);
var monitor = this.manager.getMonitor();
this.unsubscribeFromOffsetChange = monitor.subscribeToOffsetChange(this.handleChange);
this.unsubscribeFromStateChange = monitor.subscribeToStateChange(this.handleChange);
}
}, {
key: "getCurrentState",
value: function getCurrentState() {
if (!this.manager) {
return {};
}
var monitor = this.manager.getMonitor();
return collect(monitor, this.props);
}
}]);
return DragLayerContainer;
}(React.Component);
DragLayerContainer.displayName = "DragLayer(".concat(displayName, ")");
DragLayerContainer.DecoratedComponent = DecoratedComponent;
return hoistNonReactStatics_cjs(DragLayerContainer, DecoratedComponent);
};
}
exports.DndContext = DndContext;
exports.DndProvider = DndProvider;
exports.DragLayer = DragLayer;
exports.DragPreviewImage = DragPreviewImage;
exports.DragSource = DragSource;
exports.DropTarget = DropTarget;
exports.createDndContext = createDndContext;
exports.useDrag = useDrag;
exports.useDragLayer = useDragLayer;
exports.useDrop = useDrop;
Object.defineProperty(exports, '__esModule', { value: true });
})));