|
- 'use strict';
-
- Object.defineProperty(exports, "__esModule", {
- value: true
- });
-
- var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
-
- var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
-
- var _createClass = function () { function defineProperties(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); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
-
- exports.default = DragLayer;
-
- var _react = require('react');
-
- var _react2 = _interopRequireDefault(_react);
-
- var _propTypes = require('prop-types');
-
- var _propTypes2 = _interopRequireDefault(_propTypes);
-
- var _hoistNonReactStatics = require('hoist-non-react-statics');
-
- var _hoistNonReactStatics2 = _interopRequireDefault(_hoistNonReactStatics);
-
- var _isPlainObject = require('lodash/isPlainObject');
-
- var _isPlainObject2 = _interopRequireDefault(_isPlainObject);
-
- var _invariant = require('invariant');
-
- var _invariant2 = _interopRequireDefault(_invariant);
-
- var _shallowEqual = require('./utils/shallowEqual');
-
- var _shallowEqual2 = _interopRequireDefault(_shallowEqual);
-
- var _shallowEqualScalar = require('./utils/shallowEqualScalar');
-
- var _shallowEqualScalar2 = _interopRequireDefault(_shallowEqualScalar);
-
- var _checkDecoratorArguments = require('./utils/checkDecoratorArguments');
-
- var _checkDecoratorArguments2 = _interopRequireDefault(_checkDecoratorArguments);
-
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
- function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
- function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
-
- function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
-
- function DragLayer(collect) {
- var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-
- _checkDecoratorArguments2.default.apply(undefined, ['DragLayer', 'collect[, options]'].concat(Array.prototype.slice.call(arguments))); // eslint-disable-line prefer-rest-params
- (0, _invariant2.default)(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-drag-layer.html', collect);
- (0, _invariant2.default)((0, _isPlainObject2.default)(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-drag-layer.html', options);
-
- return function decorateLayer(DecoratedComponent) {
- var _class, _temp;
-
- var _options$arePropsEqua = options.arePropsEqual,
- arePropsEqual = _options$arePropsEqua === undefined ? _shallowEqualScalar2.default : _options$arePropsEqua;
-
- var displayName = DecoratedComponent.displayName || DecoratedComponent.name || 'Component';
-
- var DragLayerContainer = (_temp = _class = function (_Component) {
- _inherits(DragLayerContainer, _Component);
-
- _createClass(DragLayerContainer, [{
- key: 'getDecoratedComponentInstance',
- value: function getDecoratedComponentInstance() {
- (0, _invariant2.default)(this.child, 'In order to access an instance of the decorated component it can not be a stateless component.');
- return this.child;
- }
- }, {
- key: 'shouldComponentUpdate',
- value: function shouldComponentUpdate(nextProps, nextState) {
- return !arePropsEqual(nextProps, this.props) || !(0, _shallowEqual2.default)(nextState, this.state);
- }
- }]);
-
- function DragLayerContainer(props, context) {
- _classCallCheck(this, DragLayerContainer);
-
- var _this = _possibleConstructorReturn(this, (DragLayerContainer.__proto__ || Object.getPrototypeOf(DragLayerContainer)).call(this, props));
-
- _this.handleChange = _this.handleChange.bind(_this);
-
- _this.manager = context.dragDropManager;
- (0, _invariant2.default)(_typeof(_this.manager) === 'object', 'Could not find the drag and drop manager in the context of %s. ' + 'Make sure to wrap the top-level component of your app with DragDropContext. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs-troubleshooting.html#could-not-find-the-drag-and-drop-manager-in-the-context', displayName, displayName);
-
- _this.state = _this.getCurrentState();
- return _this;
- }
-
- _createClass(DragLayerContainer, [{
- key: 'componentDidMount',
- value: function componentDidMount() {
- this.isCurrentlyMounted = true;
-
- var monitor = this.manager.getMonitor();
- this.unsubscribeFromOffsetChange = monitor.subscribeToOffsetChange(this.handleChange);
- this.unsubscribeFromStateChange = monitor.subscribeToStateChange(this.handleChange);
-
- this.handleChange();
- }
- }, {
- key: 'componentWillUnmount',
- value: function componentWillUnmount() {
- this.isCurrentlyMounted = false;
-
- this.unsubscribeFromOffsetChange();
- this.unsubscribeFromStateChange();
- }
- }, {
- key: 'handleChange',
- value: function handleChange() {
- if (!this.isCurrentlyMounted) {
- return;
- }
-
- var nextState = this.getCurrentState();
- if (!(0, _shallowEqual2.default)(nextState, this.state)) {
- this.setState(nextState);
- }
- }
- }, {
- key: 'getCurrentState',
- value: function getCurrentState() {
- var monitor = this.manager.getMonitor();
- return collect(monitor, this.props);
- }
- }, {
- key: 'render',
- value: function render() {
- var _this2 = this;
-
- return _react2.default.createElement(DecoratedComponent, _extends({}, this.props, this.state, {
- ref: function ref(child) {
- _this2.child = child;
- }
- }));
- }
- }]);
-
- return DragLayerContainer;
- }(_react.Component), _class.DecoratedComponent = DecoratedComponent, _class.displayName = 'DragLayer(' + displayName + ')', _class.contextTypes = {
- dragDropManager: _propTypes2.default.object.isRequired
- }, _temp);
-
-
- return (0, _hoistNonReactStatics2.default)(DragLayerContainer, DecoratedComponent);
- };
- }
|