1 | import _extends from '@babel/runtime/helpers/esm/extends';
|
2 | import _slicedToArray from '@babel/runtime/helpers/esm/slicedToArray';
|
3 | import _toConsumableArray from '@babel/runtime/helpers/esm/toConsumableArray';
|
4 | import _classCallCheck from '@babel/runtime/helpers/esm/classCallCheck';
|
5 | import _createClass from '@babel/runtime/helpers/esm/createClass';
|
6 | import _possibleConstructorReturn from '@babel/runtime/helpers/esm/possibleConstructorReturn';
|
7 | import _getPrototypeOf from '@babel/runtime/helpers/esm/getPrototypeOf';
|
8 | import _inherits from '@babel/runtime/helpers/esm/inherits';
|
9 | import _assertThisInitialized from '@babel/runtime/helpers/esm/assertThisInitialized';
|
10 | import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
|
11 | import { createElement, Component } from 'react';
|
12 | import PropTypes from 'prop-types';
|
13 | import { findDOMNode } from 'react-dom';
|
14 | import invariant from 'invariant';
|
15 |
|
16 | var Manager = function () {
|
17 | function Manager() {
|
18 | _classCallCheck(this, Manager);
|
19 |
|
20 | _defineProperty(this, "refs", {});
|
21 | }
|
22 |
|
23 | _createClass(Manager, [{
|
24 | key: "add",
|
25 | value: function add(collection, ref) {
|
26 | if (!this.refs[collection]) {
|
27 | this.refs[collection] = [];
|
28 | }
|
29 |
|
30 | this.refs[collection].push(ref);
|
31 | }
|
32 | }, {
|
33 | key: "remove",
|
34 | value: function remove(collection, ref) {
|
35 | var index = this.getIndex(collection, ref);
|
36 |
|
37 | if (index !== -1) {
|
38 | this.refs[collection].splice(index, 1);
|
39 | }
|
40 | }
|
41 | }, {
|
42 | key: "isActive",
|
43 | value: function isActive() {
|
44 | return this.active;
|
45 | }
|
46 | }, {
|
47 | key: "getActive",
|
48 | value: function getActive() {
|
49 | var _this = this;
|
50 |
|
51 | return this.refs[this.active.collection].find(function (_ref) {
|
52 | var node = _ref.node;
|
53 | return node.sortableInfo.index == _this.active.index;
|
54 | });
|
55 | }
|
56 | }, {
|
57 | key: "getIndex",
|
58 | value: function getIndex(collection, ref) {
|
59 | return this.refs[collection].indexOf(ref);
|
60 | }
|
61 | }, {
|
62 | key: "getOrderedRefs",
|
63 | value: function getOrderedRefs() {
|
64 | var collection = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.active.collection;
|
65 | return this.refs[collection].sort(sortByIndex);
|
66 | }
|
67 | }]);
|
68 |
|
69 | return Manager;
|
70 | }();
|
71 |
|
72 | function sortByIndex(_ref2, _ref3) {
|
73 | var index1 = _ref2.node.sortableInfo.index;
|
74 | var index2 = _ref3.node.sortableInfo.index;
|
75 | return index1 - index2;
|
76 | }
|
77 |
|
78 | function arrayMove(array, from, to) {
|
79 | array = array.slice();
|
80 | array.splice(to < 0 ? array.length + to : to, 0, array.splice(from, 1)[0]);
|
81 | return array;
|
82 | }
|
83 | function omit(obj) {
|
84 | for (var _len = arguments.length, keysToOmit = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
|
85 | keysToOmit[_key - 1] = arguments[_key];
|
86 | }
|
87 |
|
88 | return Object.keys(obj).reduce(function (acc, key) {
|
89 | if (keysToOmit.indexOf(key) === -1) {
|
90 | acc[key] = obj[key];
|
91 | }
|
92 |
|
93 | return acc;
|
94 | }, {});
|
95 | }
|
96 | var events = {
|
97 | start: ['touchstart', 'mousedown'],
|
98 | move: ['touchmove', 'mousemove'],
|
99 | end: ['touchend', 'touchcancel', 'mouseup']
|
100 | };
|
101 | var vendorPrefix = function () {
|
102 | if (typeof window === 'undefined' || typeof document === 'undefined') {
|
103 | return '';
|
104 | }
|
105 |
|
106 | var styles = window.getComputedStyle(document.documentElement, '') || ['-moz-hidden-iframe'];
|
107 | var pre = (Array.prototype.slice.call(styles).join('').match(/-(moz|webkit|ms)-/) || styles.OLink === '' && ['', 'o'])[1];
|
108 |
|
109 | switch (pre) {
|
110 | case 'ms':
|
111 | return 'ms';
|
112 |
|
113 | default:
|
114 | return pre && pre.length ? pre[0].toUpperCase() + pre.substr(1) : '';
|
115 | }
|
116 | }();
|
117 | function closest(el, fn) {
|
118 | while (el) {
|
119 | if (fn(el)) {
|
120 | return el;
|
121 | }
|
122 |
|
123 | el = el.parentNode;
|
124 | }
|
125 |
|
126 | return null;
|
127 | }
|
128 | function limit(min, max, value) {
|
129 | return Math.max(min, Math.min(value, max));
|
130 | }
|
131 |
|
132 | function getPixelValue(stringValue) {
|
133 | if (stringValue.substr(-2) === 'px') {
|
134 | return parseFloat(stringValue);
|
135 | }
|
136 |
|
137 | return 0;
|
138 | }
|
139 |
|
140 | function getElementMargin(element) {
|
141 | var style = window.getComputedStyle(element);
|
142 | return {
|
143 | top: getPixelValue(style.marginTop),
|
144 | right: getPixelValue(style.marginRight),
|
145 | bottom: getPixelValue(style.marginBottom),
|
146 | left: getPixelValue(style.marginLeft)
|
147 | };
|
148 | }
|
149 | function provideDisplayName(prefix, Component$$1) {
|
150 | var componentName = Component$$1.displayName || Component$$1.name;
|
151 | return componentName ? "".concat(prefix, "(").concat(componentName, ")") : prefix;
|
152 | }
|
153 | function getPosition(event) {
|
154 | if (event.touches && event.touches.length) {
|
155 | return {
|
156 | x: event.touches[0].pageX,
|
157 | y: event.touches[0].pageY
|
158 | };
|
159 | } else if (event.changedTouches && event.changedTouches.length) {
|
160 | return {
|
161 | x: event.changedTouches[0].pageX,
|
162 | y: event.changedTouches[0].pageY
|
163 | };
|
164 | } else {
|
165 | return {
|
166 | x: event.pageX,
|
167 | y: event.pageY
|
168 | };
|
169 | }
|
170 | }
|
171 | function isTouchEvent(event) {
|
172 | return event.touches && event.touches.length || event.changedTouches && event.changedTouches.length;
|
173 | }
|
174 | function getEdgeOffset(node, parent) {
|
175 | var offset = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {
|
176 | top: 0,
|
177 | left: 0
|
178 | };
|
179 |
|
180 | if (!node) {
|
181 | return undefined;
|
182 | }
|
183 |
|
184 | var nodeOffset = {
|
185 | top: offset.top + node.offsetTop,
|
186 | left: offset.left + node.offsetLeft
|
187 | };
|
188 |
|
189 | if (node.parentNode === parent) {
|
190 | return nodeOffset;
|
191 | }
|
192 |
|
193 | return getEdgeOffset(node.parentNode, parent, nodeOffset);
|
194 | }
|
195 | function getLockPixelOffset(_ref) {
|
196 | var lockOffset = _ref.lockOffset,
|
197 | width = _ref.width,
|
198 | height = _ref.height;
|
199 | var offsetX = lockOffset;
|
200 | var offsetY = lockOffset;
|
201 | var unit = 'px';
|
202 |
|
203 | if (typeof lockOffset === 'string') {
|
204 | var match = /^[+-]?\d*(?:\.\d*)?(px|%)$/.exec(lockOffset);
|
205 | invariant(match !== null, 'lockOffset value should be a number or a string of a ' + 'number followed by "px" or "%". Given %s', lockOffset);
|
206 | offsetX = parseFloat(lockOffset);
|
207 | offsetY = parseFloat(lockOffset);
|
208 | unit = match[1];
|
209 | }
|
210 |
|
211 | invariant(isFinite(offsetX) && isFinite(offsetY), 'lockOffset value should be a finite. Given %s', lockOffset);
|
212 |
|
213 | if (unit === '%') {
|
214 | offsetX = offsetX * width / 100;
|
215 | offsetY = offsetY * height / 100;
|
216 | }
|
217 |
|
218 | return {
|
219 | x: offsetX,
|
220 | y: offsetY
|
221 | };
|
222 | }
|
223 |
|
224 | function _finallyRethrows(body, finalizer) {
|
225 | try {
|
226 | var result = body();
|
227 | } catch (e) {
|
228 | return finalizer(true, e);
|
229 | }
|
230 |
|
231 | if (result && result.then) {
|
232 | return result.then(finalizer.bind(null, false), finalizer.bind(null, true));
|
233 | }
|
234 |
|
235 | return finalizer(false, value);
|
236 | }
|
237 | function sortableContainer(WrappedComponent) {
|
238 | var _class, _temp;
|
239 |
|
240 | var config = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {
|
241 | withRef: false
|
242 | };
|
243 | return _temp = _class = function (_React$Component) {
|
244 | _inherits(WithSortableContainer, _React$Component);
|
245 |
|
246 | function WithSortableContainer(props) {
|
247 | var _this;
|
248 |
|
249 | _classCallCheck(this, WithSortableContainer);
|
250 |
|
251 | _this = _possibleConstructorReturn(this, _getPrototypeOf(WithSortableContainer).call(this, props));
|
252 |
|
253 | _defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "handleStart", function (event) {
|
254 | var _this$props = _this.props,
|
255 | distance = _this$props.distance,
|
256 | shouldCancelStart = _this$props.shouldCancelStart;
|
257 |
|
258 | if (event.button === 2 || shouldCancelStart(event)) {
|
259 | return;
|
260 | }
|
261 |
|
262 | _this._touched = true;
|
263 | _this._pos = getPosition(event);
|
264 | var node = closest(event.target, function (el) {
|
265 | return el.sortableInfo != null;
|
266 | });
|
267 |
|
268 | if (node && node.sortableInfo && _this.nodeIsChild(node) && !_this.state.sorting) {
|
269 | var useDragHandle = _this.props.useDragHandle;
|
270 | var _node$sortableInfo = node.sortableInfo,
|
271 | index = _node$sortableInfo.index,
|
272 | collection = _node$sortableInfo.collection;
|
273 |
|
274 | if (useDragHandle && !closest(event.target, function (el) {
|
275 | return el.sortableHandle != null;
|
276 | })) {
|
277 | return;
|
278 | }
|
279 |
|
280 | _this.manager.active = {
|
281 | index: index,
|
282 | collection: collection
|
283 | };
|
284 |
|
285 | if (!isTouchEvent(event) && event.target.tagName.toLowerCase() === 'a') {
|
286 | event.preventDefault();
|
287 | }
|
288 |
|
289 | if (!distance) {
|
290 | if (_this.props.pressDelay === 0) {
|
291 | _this.handlePress(event);
|
292 | } else {
|
293 | _this.pressTimer = setTimeout(function () {
|
294 | return _this.handlePress(event);
|
295 | }, _this.props.pressDelay);
|
296 | }
|
297 | }
|
298 | }
|
299 | });
|
300 |
|
301 | _defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "nodeIsChild", function (node) {
|
302 | return node.sortableInfo.manager === _this.manager;
|
303 | });
|
304 |
|
305 | _defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "handleMove", function (event) {
|
306 | var _this$props2 = _this.props,
|
307 | distance = _this$props2.distance,
|
308 | pressThreshold = _this$props2.pressThreshold;
|
309 |
|
310 | if (!_this.state.sorting && _this._touched && !_this._awaitingUpdateBeforeSortStart) {
|
311 | var position = getPosition(event);
|
312 | var delta = {
|
313 | x: _this._pos.x - position.x,
|
314 | y: _this._pos.y - position.y
|
315 | };
|
316 | var combinedDelta = Math.abs(delta.x) + Math.abs(delta.y);
|
317 | _this.delta = delta;
|
318 |
|
319 | if (!distance && (!pressThreshold || pressThreshold && combinedDelta >= pressThreshold)) {
|
320 | clearTimeout(_this.cancelTimer);
|
321 | _this.cancelTimer = setTimeout(_this.cancel, 0);
|
322 | } else if (distance && combinedDelta >= distance && _this.manager.isActive()) {
|
323 | _this.handlePress(event);
|
324 | }
|
325 | }
|
326 | });
|
327 |
|
328 | _defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "handleEnd", function () {
|
329 | _this._touched = false;
|
330 |
|
331 | _this.cancel();
|
332 | });
|
333 |
|
334 | _defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "cancel", function () {
|
335 | var distance = _this.props.distance;
|
336 | var sorting = _this.state.sorting;
|
337 |
|
338 | if (!sorting) {
|
339 | if (!distance) {
|
340 | clearTimeout(_this.pressTimer);
|
341 | }
|
342 |
|
343 | _this.manager.active = null;
|
344 | }
|
345 | });
|
346 |
|
347 | _defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "handlePress", function (event) {
|
348 | try {
|
349 | var active = _this.manager.getActive();
|
350 |
|
351 | var _temp6 = function () {
|
352 | if (active) {
|
353 | var _temp7 = function _temp7() {
|
354 | var margin = getElementMargin(_node);
|
355 |
|
356 | var containerBoundingRect = _this.container.getBoundingClientRect();
|
357 |
|
358 | var dimensions = _getHelperDimensions({
|
359 | index: _index,
|
360 | node: _node,
|
361 | collection: _collection
|
362 | });
|
363 |
|
364 | _this.node = _node;
|
365 | _this.margin = margin;
|
366 | _this.width = dimensions.width;
|
367 | _this.height = dimensions.height;
|
368 | _this.marginOffset = {
|
369 | x: _this.margin.left + _this.margin.right,
|
370 | y: Math.max(_this.margin.top, _this.margin.bottom)
|
371 | };
|
372 | _this.boundingClientRect = _node.getBoundingClientRect();
|
373 | _this.containerBoundingRect = containerBoundingRect;
|
374 | _this.index = _index;
|
375 | _this.newIndex = _index;
|
376 | _this.axis = {
|
377 | x: _axis.indexOf('x') >= 0,
|
378 | y: _axis.indexOf('y') >= 0
|
379 | };
|
380 | _this.offsetEdge = getEdgeOffset(_node, _this.container);
|
381 | _this.initialOffset = getPosition(event);
|
382 | _this.initialScroll = {
|
383 | top: _this.container.scrollTop,
|
384 | left: _this.container.scrollLeft
|
385 | };
|
386 | _this.initialWindowScroll = {
|
387 | top: window.pageYOffset,
|
388 | left: window.pageXOffset
|
389 | };
|
390 |
|
391 | var fields = _node.querySelectorAll('input, textarea, select');
|
392 |
|
393 | var clonedNode = _node.cloneNode(true);
|
394 |
|
395 | var clonedFields = _toConsumableArray(clonedNode.querySelectorAll('input, textarea, select'));
|
396 |
|
397 | clonedFields.forEach(function (field, i) {
|
398 | if (field.type !== 'file' && fields[_index]) {
|
399 | field.value = fields[i].value;
|
400 | }
|
401 | });
|
402 | _this.helper = _this.helperContainer.appendChild(clonedNode);
|
403 | _this.helper.style.position = 'fixed';
|
404 | _this.helper.style.top = "".concat(_this.boundingClientRect.top - margin.top, "px");
|
405 | _this.helper.style.left = "".concat(_this.boundingClientRect.left - margin.left, "px");
|
406 | _this.helper.style.width = "".concat(_this.width, "px");
|
407 | _this.helper.style.height = "".concat(_this.height, "px");
|
408 | _this.helper.style.boxSizing = 'border-box';
|
409 | _this.helper.style.pointerEvents = 'none';
|
410 |
|
411 | if (_hideSortableGhost) {
|
412 | _this.sortableGhost = _node;
|
413 | _node.style.visibility = 'hidden';
|
414 | _node.style.opacity = 0;
|
415 | }
|
416 |
|
417 | _this.minTranslate = {};
|
418 | _this.maxTranslate = {};
|
419 |
|
420 | if (_this.axis.x) {
|
421 | _this.minTranslate.x = (_useWindowAsScrollContainer ? 0 : containerBoundingRect.left) - _this.boundingClientRect.left - _this.width / 2;
|
422 | _this.maxTranslate.x = (_useWindowAsScrollContainer ? _this.contentWindow.innerWidth : containerBoundingRect.left + containerBoundingRect.width) - _this.boundingClientRect.left - _this.width / 2;
|
423 | }
|
424 |
|
425 | if (_this.axis.y) {
|
426 | _this.minTranslate.y = (_useWindowAsScrollContainer ? 0 : containerBoundingRect.top) - _this.boundingClientRect.top - _this.height / 2;
|
427 | _this.maxTranslate.y = (_useWindowAsScrollContainer ? _this.contentWindow.innerHeight : containerBoundingRect.top + containerBoundingRect.height) - _this.boundingClientRect.top - _this.height / 2;
|
428 | }
|
429 |
|
430 | if (_helperClass) {
|
431 | var _this$helper$classLis;
|
432 |
|
433 | (_this$helper$classLis = _this.helper.classList).add.apply(_this$helper$classLis, _toConsumableArray(_helperClass.split(' ')));
|
434 | }
|
435 |
|
436 | _this.listenerNode = event.touches ? _node : _this.contentWindow;
|
437 | events.move.forEach(function (eventName) {
|
438 | return _this.listenerNode.addEventListener(eventName, _this.handleSortMove, false);
|
439 | });
|
440 | events.end.forEach(function (eventName) {
|
441 | return _this.listenerNode.addEventListener(eventName, _this.handleSortEnd, false);
|
442 | });
|
443 |
|
444 | _this.setState({
|
445 | sorting: true,
|
446 | sortingIndex: _index
|
447 | });
|
448 |
|
449 | if (_onSortStart) {
|
450 | _onSortStart({
|
451 | node: _node,
|
452 | index: _index,
|
453 | collection: _collection
|
454 | }, event);
|
455 | }
|
456 | };
|
457 |
|
458 | var _this$props3 = _this.props,
|
459 | _axis = _this$props3.axis,
|
460 | _getHelperDimensions = _this$props3.getHelperDimensions,
|
461 | _helperClass = _this$props3.helperClass,
|
462 | _hideSortableGhost = _this$props3.hideSortableGhost,
|
463 | updateBeforeSortStart = _this$props3.updateBeforeSortStart,
|
464 | _onSortStart = _this$props3.onSortStart,
|
465 | _useWindowAsScrollContainer = _this$props3.useWindowAsScrollContainer;
|
466 | var _node = active.node,
|
467 | _collection = active.collection;
|
468 | var _index = _node.sortableInfo.index;
|
469 |
|
470 | var _temp8 = function () {
|
471 | if (typeof updateBeforeSortStart === 'function') {
|
472 | _this._awaitingUpdateBeforeSortStart = true;
|
473 |
|
474 | var _temp9 = _finallyRethrows(function () {
|
475 | return Promise.resolve(updateBeforeSortStart({
|
476 | node: _node,
|
477 | index: _index,
|
478 | collection: _collection
|
479 | }, event)).then(function () {});
|
480 | }, function (_wasThrown, _result) {
|
481 | _this._awaitingUpdateBeforeSortStart = false;
|
482 | if (_wasThrown) throw _result;
|
483 | return _result;
|
484 | });
|
485 |
|
486 | if (_temp9 && _temp9.then) return _temp9.then(function () {});
|
487 | }
|
488 | }();
|
489 |
|
490 | return _temp8 && _temp8.then ? _temp8.then(_temp7) : _temp7(_temp8);
|
491 | }
|
492 | }();
|
493 |
|
494 | return Promise.resolve(_temp6 && _temp6.then ? _temp6.then(function () {}) : void 0);
|
495 | } catch (e) {
|
496 | return Promise.reject(e);
|
497 | }
|
498 | });
|
499 |
|
500 | _defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "handleSortMove", function (event) {
|
501 | var onSortMove = _this.props.onSortMove;
|
502 | event.preventDefault();
|
503 |
|
504 | _this.updatePosition(event);
|
505 |
|
506 | _this.animateNodes();
|
507 |
|
508 | _this.autoscroll();
|
509 |
|
510 | if (onSortMove) {
|
511 | onSortMove(event);
|
512 | }
|
513 | });
|
514 |
|
515 | _defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "handleSortEnd", function (event) {
|
516 | var _this$props4 = _this.props,
|
517 | hideSortableGhost = _this$props4.hideSortableGhost,
|
518 | onSortEnd = _this$props4.onSortEnd;
|
519 | var collection = _this.manager.active.collection;
|
520 |
|
521 | if (_this.listenerNode) {
|
522 | events.move.forEach(function (eventName) {
|
523 | return _this.listenerNode.removeEventListener(eventName, _this.handleSortMove);
|
524 | });
|
525 | events.end.forEach(function (eventName) {
|
526 | return _this.listenerNode.removeEventListener(eventName, _this.handleSortEnd);
|
527 | });
|
528 | }
|
529 |
|
530 | _this.helper.parentNode.removeChild(_this.helper);
|
531 |
|
532 | if (hideSortableGhost && _this.sortableGhost) {
|
533 | _this.sortableGhost.style.visibility = '';
|
534 | _this.sortableGhost.style.opacity = '';
|
535 | }
|
536 |
|
537 | var nodes = _this.manager.refs[collection];
|
538 |
|
539 | for (var i = 0, len = nodes.length; i < len; i++) {
|
540 | var _node2 = nodes[i];
|
541 | var el = _node2.node;
|
542 | _node2.edgeOffset = null;
|
543 | el.style["".concat(vendorPrefix, "Transform")] = '';
|
544 | el.style["".concat(vendorPrefix, "TransitionDuration")] = '';
|
545 | }
|
546 |
|
547 | clearInterval(_this.autoscrollInterval);
|
548 | _this.autoscrollInterval = null;
|
549 | _this.manager.active = null;
|
550 |
|
551 | _this.setState({
|
552 | sorting: false,
|
553 | sortingIndex: null
|
554 | });
|
555 |
|
556 | if (typeof onSortEnd === 'function') {
|
557 | onSortEnd({
|
558 | oldIndex: _this.index,
|
559 | newIndex: _this.newIndex,
|
560 | collection: collection
|
561 | }, event);
|
562 | }
|
563 |
|
564 | _this._touched = false;
|
565 | });
|
566 |
|
567 | _defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "autoscroll", function () {
|
568 | var disableAutoscroll = _this.props.disableAutoscroll;
|
569 |
|
570 | if (disableAutoscroll) {
|
571 | return;
|
572 | }
|
573 |
|
574 | var translate = _this.translate;
|
575 | var direction = {
|
576 | x: 0,
|
577 | y: 0
|
578 | };
|
579 | var speed = {
|
580 | x: 1,
|
581 | y: 1
|
582 | };
|
583 | var acceleration = {
|
584 | x: 10,
|
585 | y: 10
|
586 | };
|
587 | var _this$scrollContainer = _this.scrollContainer,
|
588 | scrollTop = _this$scrollContainer.scrollTop,
|
589 | scrollLeft = _this$scrollContainer.scrollLeft,
|
590 | scrollHeight = _this$scrollContainer.scrollHeight,
|
591 | scrollWidth = _this$scrollContainer.scrollWidth,
|
592 | clientHeight = _this$scrollContainer.clientHeight,
|
593 | clientWidth = _this$scrollContainer.clientWidth;
|
594 | var isTop = scrollTop === 0;
|
595 | var isBottom = scrollHeight - scrollTop - clientHeight === 0;
|
596 | var isLeft = scrollLeft === 0;
|
597 | var isRight = scrollWidth - scrollLeft - clientWidth === 0;
|
598 |
|
599 | if (translate.y >= _this.maxTranslate.y - _this.height / 2 && !isBottom) {
|
600 | direction.y = 1;
|
601 | speed.y = acceleration.y * Math.abs((_this.maxTranslate.y - _this.height / 2 - translate.y) / _this.height);
|
602 | } else if (translate.x >= _this.maxTranslate.x - _this.width / 2 && !isRight) {
|
603 | direction.x = 1;
|
604 | speed.x = acceleration.x * Math.abs((_this.maxTranslate.x - _this.width / 2 - translate.x) / _this.width);
|
605 | } else if (translate.y <= _this.minTranslate.y + _this.height / 2 && !isTop) {
|
606 | direction.y = -1;
|
607 | speed.y = acceleration.y * Math.abs((translate.y - _this.height / 2 - _this.minTranslate.y) / _this.height);
|
608 | } else if (translate.x <= _this.minTranslate.x + _this.width / 2 && !isLeft) {
|
609 | direction.x = -1;
|
610 | speed.x = acceleration.x * Math.abs((translate.x - _this.width / 2 - _this.minTranslate.x) / _this.width);
|
611 | }
|
612 |
|
613 | if (_this.autoscrollInterval) {
|
614 | clearInterval(_this.autoscrollInterval);
|
615 | _this.autoscrollInterval = null;
|
616 | _this.isAutoScrolling = false;
|
617 | }
|
618 |
|
619 | if (direction.x !== 0 || direction.y !== 0) {
|
620 | _this.autoscrollInterval = setInterval(function () {
|
621 | _this.isAutoScrolling = true;
|
622 | var offset = {
|
623 | left: speed.x * direction.x,
|
624 | top: speed.y * direction.y
|
625 | };
|
626 | _this.scrollContainer.scrollTop += offset.top;
|
627 | _this.scrollContainer.scrollLeft += offset.left;
|
628 | _this.translate.x += offset.left;
|
629 | _this.translate.y += offset.top;
|
630 |
|
631 | _this.animateNodes();
|
632 | }, 5);
|
633 | }
|
634 | });
|
635 |
|
636 | _this.manager = new Manager();
|
637 | _this.events = {
|
638 | start: _this.handleStart,
|
639 | move: _this.handleMove,
|
640 | end: _this.handleEnd
|
641 | };
|
642 | invariant(!(props.distance && props.pressDelay), 'Attempted to set both `pressDelay` and `distance` on SortableContainer, you may only use one or the other, not both at the same time.');
|
643 | _this.state = {};
|
644 | return _this;
|
645 | }
|
646 |
|
647 | _createClass(WithSortableContainer, [{
|
648 | key: "getChildContext",
|
649 | value: function getChildContext() {
|
650 | return {
|
651 | manager: this.manager
|
652 | };
|
653 | }
|
654 | }, {
|
655 | key: "componentDidMount",
|
656 | value: function componentDidMount() {
|
657 | var _this2 = this;
|
658 |
|
659 | var useWindowAsScrollContainer = this.props.useWindowAsScrollContainer;
|
660 | var container = this.getContainer();
|
661 | Promise.resolve(container).then(function (containerNode) {
|
662 | _this2.container = containerNode;
|
663 | _this2.document = _this2.container.ownerDocument || document;
|
664 | var contentWindow = _this2.props.contentWindow || _this2.document.defaultView || window;
|
665 | _this2.contentWindow = typeof contentWindow === 'function' ? contentWindow() : contentWindow;
|
666 | _this2.scrollContainer = useWindowAsScrollContainer ? _this2.document.scrollingElement || _this2.document.documentElement : _this2.container;
|
667 |
|
668 | var _loop = function _loop(key) {
|
669 | if (_this2.events.hasOwnProperty(key)) {
|
670 | events[key].forEach(function (eventName) {
|
671 | return _this2.container.addEventListener(eventName, _this2.events[key], false);
|
672 | });
|
673 | }
|
674 | };
|
675 |
|
676 | for (var key in _this2.events) {
|
677 | _loop(key);
|
678 | }
|
679 | });
|
680 | }
|
681 | }, {
|
682 | key: "componentWillUnmount",
|
683 | value: function componentWillUnmount() {
|
684 | var _this3 = this;
|
685 |
|
686 | if (this.container) {
|
687 | var _loop2 = function _loop2(key) {
|
688 | if (_this3.events.hasOwnProperty(key)) {
|
689 | events[key].forEach(function (eventName) {
|
690 | return _this3.container.removeEventListener(eventName, _this3.events[key]);
|
691 | });
|
692 | }
|
693 | };
|
694 |
|
695 | for (var key in this.events) {
|
696 | _loop2(key);
|
697 | }
|
698 | }
|
699 | }
|
700 | }, {
|
701 | key: "getLockPixelOffsets",
|
702 | value: function getLockPixelOffsets() {
|
703 | var width = this.width,
|
704 | height = this.height;
|
705 | var lockOffset = this.props.lockOffset;
|
706 | var offsets = Array.isArray(lockOffset) ? lockOffset : [lockOffset, lockOffset];
|
707 | invariant(offsets.length === 2, 'lockOffset prop of SortableContainer should be a single ' + 'value or an array of exactly two values. Given %s', lockOffset);
|
708 |
|
709 | var _offsets = _slicedToArray(offsets, 2),
|
710 | minLockOffset = _offsets[0],
|
711 | maxLockOffset = _offsets[1];
|
712 |
|
713 | return [getLockPixelOffset({
|
714 | lockOffset: minLockOffset,
|
715 | width: width,
|
716 | height: height
|
717 | }), getLockPixelOffset({
|
718 | lockOffset: maxLockOffset,
|
719 | width: width,
|
720 | height: height
|
721 | })];
|
722 | }
|
723 | }, {
|
724 | key: "updatePosition",
|
725 | value: function updatePosition(event) {
|
726 | var _this$props5 = this.props,
|
727 | lockAxis = _this$props5.lockAxis,
|
728 | lockToContainerEdges = _this$props5.lockToContainerEdges;
|
729 | var offset = getPosition(event);
|
730 | var translate = {
|
731 | x: offset.x - this.initialOffset.x,
|
732 | y: offset.y - this.initialOffset.y
|
733 | };
|
734 | translate.y -= window.pageYOffset - this.initialWindowScroll.top;
|
735 | translate.x -= window.pageXOffset - this.initialWindowScroll.left;
|
736 | this.translate = translate;
|
737 |
|
738 | if (lockToContainerEdges) {
|
739 | var _this$getLockPixelOff = this.getLockPixelOffsets(),
|
740 | _this$getLockPixelOff2 = _slicedToArray(_this$getLockPixelOff, 2),
|
741 | minLockOffset = _this$getLockPixelOff2[0],
|
742 | maxLockOffset = _this$getLockPixelOff2[1];
|
743 |
|
744 | var minOffset = {
|
745 | x: this.width / 2 - minLockOffset.x,
|
746 | y: this.height / 2 - minLockOffset.y
|
747 | };
|
748 | var maxOffset = {
|
749 | x: this.width / 2 - maxLockOffset.x,
|
750 | y: this.height / 2 - maxLockOffset.y
|
751 | };
|
752 | translate.x = limit(this.minTranslate.x + minOffset.x, this.maxTranslate.x - maxOffset.x, translate.x);
|
753 | translate.y = limit(this.minTranslate.y + minOffset.y, this.maxTranslate.y - maxOffset.y, translate.y);
|
754 | }
|
755 |
|
756 | if (lockAxis === 'x') {
|
757 | translate.y = 0;
|
758 | } else if (lockAxis === 'y') {
|
759 | translate.x = 0;
|
760 | }
|
761 |
|
762 | this.helper.style["".concat(vendorPrefix, "Transform")] = "translate3d(".concat(translate.x, "px,").concat(translate.y, "px, 0)");
|
763 | }
|
764 | }, {
|
765 | key: "animateNodes",
|
766 | value: function animateNodes() {
|
767 | var _this$props6 = this.props,
|
768 | transitionDuration = _this$props6.transitionDuration,
|
769 | hideSortableGhost = _this$props6.hideSortableGhost,
|
770 | onSortOver = _this$props6.onSortOver;
|
771 | var nodes = this.manager.getOrderedRefs();
|
772 | var containerScrollDelta = {
|
773 | left: this.container.scrollLeft - this.initialScroll.left,
|
774 | top: this.container.scrollTop - this.initialScroll.top
|
775 | };
|
776 | var sortingOffset = {
|
777 | left: this.offsetEdge.left + this.translate.x + containerScrollDelta.left,
|
778 | top: this.offsetEdge.top + this.translate.y + containerScrollDelta.top
|
779 | };
|
780 | var windowScrollDelta = {
|
781 | top: window.pageYOffset - this.initialWindowScroll.top,
|
782 | left: window.pageXOffset - this.initialWindowScroll.left
|
783 | };
|
784 | var prevIndex = this.newIndex;
|
785 | this.newIndex = null;
|
786 |
|
787 | for (var i = 0, len = nodes.length; i < len; i++) {
|
788 | var _node3 = nodes[i].node;
|
789 | var _index2 = _node3.sortableInfo.index;
|
790 | var width = _node3.offsetWidth;
|
791 | var height = _node3.offsetHeight;
|
792 | var offset = {
|
793 | width: this.width > width ? width / 2 : this.width / 2,
|
794 | height: this.height > height ? height / 2 : this.height / 2
|
795 | };
|
796 | var translate = {
|
797 | x: 0,
|
798 | y: 0
|
799 | };
|
800 | var edgeOffset = nodes[i].edgeOffset;
|
801 |
|
802 | if (!edgeOffset) {
|
803 | edgeOffset = getEdgeOffset(_node3, this.container);
|
804 | nodes[i].edgeOffset = edgeOffset;
|
805 | }
|
806 |
|
807 | var nextNode = i < nodes.length - 1 && nodes[i + 1];
|
808 | var prevNode = i > 0 && nodes[i - 1];
|
809 |
|
810 | if (nextNode && !nextNode.edgeOffset) {
|
811 | nextNode.edgeOffset = getEdgeOffset(nextNode.node, this.container);
|
812 | }
|
813 |
|
814 | if (_index2 === this.index) {
|
815 | if (hideSortableGhost) {
|
816 | this.sortableGhost = _node3;
|
817 | _node3.style.visibility = 'hidden';
|
818 | _node3.style.opacity = 0;
|
819 | }
|
820 |
|
821 | continue;
|
822 | }
|
823 |
|
824 | if (transitionDuration) {
|
825 | _node3.style["".concat(vendorPrefix, "TransitionDuration")] = "".concat(transitionDuration, "ms");
|
826 | }
|
827 |
|
828 | if (this.axis.x) {
|
829 | if (this.axis.y) {
|
830 | if (_index2 < this.index && (sortingOffset.left + windowScrollDelta.left - offset.width <= edgeOffset.left && sortingOffset.top + windowScrollDelta.top <= edgeOffset.top + offset.height || sortingOffset.top + windowScrollDelta.top + offset.height <= edgeOffset.top)) {
|
831 | translate.x = this.width + this.marginOffset.x;
|
832 |
|
833 | if (edgeOffset.left + translate.x > this.containerBoundingRect.width - offset.width) {
|
834 | if (nextNode) {
|
835 | translate.x = nextNode.edgeOffset.left - edgeOffset.left;
|
836 | translate.y = nextNode.edgeOffset.top - edgeOffset.top;
|
837 | }
|
838 | }
|
839 |
|
840 | if (this.newIndex === null) {
|
841 | this.newIndex = _index2;
|
842 | }
|
843 | } else if (_index2 > this.index && (sortingOffset.left + windowScrollDelta.left + offset.width >= edgeOffset.left && sortingOffset.top + windowScrollDelta.top + offset.height >= edgeOffset.top || sortingOffset.top + windowScrollDelta.top + offset.height >= edgeOffset.top + height)) {
|
844 | translate.x = -(this.width + this.marginOffset.x);
|
845 |
|
846 | if (edgeOffset.left + translate.x < this.containerBoundingRect.left + offset.width) {
|
847 | if (prevNode) {
|
848 | translate.x = prevNode.edgeOffset.left - edgeOffset.left;
|
849 | translate.y = prevNode.edgeOffset.top - edgeOffset.top;
|
850 | }
|
851 | }
|
852 |
|
853 | this.newIndex = _index2;
|
854 | }
|
855 | } else {
|
856 | if (_index2 > this.index && sortingOffset.left + windowScrollDelta.left + offset.width >= edgeOffset.left) {
|
857 | translate.x = -(this.width + this.marginOffset.x);
|
858 | this.newIndex = _index2;
|
859 | } else if (_index2 < this.index && sortingOffset.left + windowScrollDelta.left <= edgeOffset.left + offset.width) {
|
860 | translate.x = this.width + this.marginOffset.x;
|
861 |
|
862 | if (this.newIndex == null) {
|
863 | this.newIndex = _index2;
|
864 | }
|
865 | }
|
866 | }
|
867 | } else if (this.axis.y) {
|
868 | if (_index2 > this.index && sortingOffset.top + windowScrollDelta.top + offset.height >= edgeOffset.top) {
|
869 | translate.y = -(this.height + this.marginOffset.y);
|
870 | this.newIndex = _index2;
|
871 | } else if (_index2 < this.index && sortingOffset.top + windowScrollDelta.top <= edgeOffset.top + offset.height) {
|
872 | translate.y = this.height + this.marginOffset.y;
|
873 |
|
874 | if (this.newIndex == null) {
|
875 | this.newIndex = _index2;
|
876 | }
|
877 | }
|
878 | }
|
879 |
|
880 | _node3.style["".concat(vendorPrefix, "Transform")] = "translate3d(".concat(translate.x, "px,").concat(translate.y, "px,0)");
|
881 | }
|
882 |
|
883 | if (this.newIndex == null) {
|
884 | this.newIndex = this.index;
|
885 | }
|
886 |
|
887 | if (onSortOver && this.newIndex !== prevIndex) {
|
888 | onSortOver({
|
889 | newIndex: this.newIndex,
|
890 | oldIndex: prevIndex,
|
891 | index: this.index,
|
892 | collection: this.manager.active.collection
|
893 | });
|
894 | }
|
895 | }
|
896 | }, {
|
897 | key: "getWrappedInstance",
|
898 | value: function getWrappedInstance() {
|
899 | invariant(config.withRef, 'To access the wrapped instance, you need to pass in {withRef: true} as the second argument of the SortableContainer() call');
|
900 | return this.refs.wrappedInstance;
|
901 | }
|
902 | }, {
|
903 | key: "getContainer",
|
904 | value: function getContainer() {
|
905 | var getContainer = this.props.getContainer;
|
906 |
|
907 | if (typeof getContainer !== 'function') {
|
908 | return findDOMNode(this);
|
909 | }
|
910 |
|
911 | return getContainer(config.withRef ? this.getWrappedInstance() : undefined);
|
912 | }
|
913 | }, {
|
914 | key: "render",
|
915 | value: function render() {
|
916 | var ref = config.withRef ? 'wrappedInstance' : null;
|
917 | return createElement(WrappedComponent, _extends({
|
918 | ref: ref
|
919 | }, omit(this.props, 'contentWindow', 'useWindowAsScrollContainer', 'distance', 'helperClass', 'hideSortableGhost', 'transitionDuration', 'useDragHandle', 'pressDelay', 'pressThreshold', 'shouldCancelStart', 'updateBeforeSortStart', 'onSortStart', 'onSortMove', 'onSortEnd', 'axis', 'lockAxis', 'lockOffset', 'lockToContainerEdges', 'getContainer', 'getHelperDimensions', 'helperContainer')));
|
920 | }
|
921 | }, {
|
922 | key: "helperContainer",
|
923 | get: function get() {
|
924 | var helperContainer = this.props.helperContainer;
|
925 |
|
926 | if (typeof helperContainer === 'function') {
|
927 | return helperContainer();
|
928 | }
|
929 |
|
930 | return this.props.helperContainer || this.document.body;
|
931 | }
|
932 | }]);
|
933 |
|
934 | return WithSortableContainer;
|
935 | }(Component), _defineProperty(_class, "displayName", provideDisplayName('sortableList', WrappedComponent)), _defineProperty(_class, "defaultProps", {
|
936 | axis: 'y',
|
937 | transitionDuration: 300,
|
938 | pressDelay: 0,
|
939 | pressThreshold: 5,
|
940 | distance: 0,
|
941 | useWindowAsScrollContainer: false,
|
942 | hideSortableGhost: true,
|
943 | shouldCancelStart: function shouldCancelStart(event) {
|
944 | var disabledElements = ['input', 'textarea', 'select', 'option', 'button'];
|
945 |
|
946 | if (disabledElements.indexOf(event.target.tagName.toLowerCase()) !== -1) {
|
947 | return true;
|
948 | }
|
949 |
|
950 | return false;
|
951 | },
|
952 | lockToContainerEdges: false,
|
953 | lockOffset: '50%',
|
954 | getHelperDimensions: function getHelperDimensions(_ref) {
|
955 | var node = _ref.node;
|
956 | return {
|
957 | width: node.offsetWidth,
|
958 | height: node.offsetHeight
|
959 | };
|
960 | },
|
961 | disableAutoscroll: false
|
962 | }), _defineProperty(_class, "propTypes", {
|
963 | axis: PropTypes.oneOf(['x', 'y', 'xy']),
|
964 | distance: PropTypes.number,
|
965 | lockAxis: PropTypes.string,
|
966 | helperClass: PropTypes.string,
|
967 | transitionDuration: PropTypes.number,
|
968 | contentWindow: PropTypes.any,
|
969 | updateBeforeSortStart: PropTypes.func,
|
970 | onSortStart: PropTypes.func,
|
971 | onSortMove: PropTypes.func,
|
972 | onSortOver: PropTypes.func,
|
973 | onSortEnd: PropTypes.func,
|
974 | shouldCancelStart: PropTypes.func,
|
975 | pressDelay: PropTypes.number,
|
976 | pressThreshold: PropTypes.number,
|
977 | useDragHandle: PropTypes.bool,
|
978 | useWindowAsScrollContainer: PropTypes.bool,
|
979 | hideSortableGhost: PropTypes.bool,
|
980 | lockToContainerEdges: PropTypes.bool,
|
981 | lockOffset: PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string]))]),
|
982 | getContainer: PropTypes.func,
|
983 | getHelperDimensions: PropTypes.func,
|
984 | helperContainer: PropTypes.oneOfType([PropTypes.func, typeof HTMLElement === 'undefined' ? PropTypes.any : PropTypes.instanceOf(HTMLElement)]),
|
985 | disableAutoscroll: PropTypes.bool
|
986 | }), _defineProperty(_class, "childContextTypes", {
|
987 | manager: PropTypes.object.isRequired
|
988 | }), _temp;
|
989 | }
|
990 |
|
991 | function sortableElement(WrappedComponent) {
|
992 | var _class, _temp;
|
993 |
|
994 | var config = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {
|
995 | withRef: false
|
996 | };
|
997 | return _temp = _class = function (_React$Component) {
|
998 | _inherits(WithSortableElement, _React$Component);
|
999 |
|
1000 | function WithSortableElement() {
|
1001 | _classCallCheck(this, WithSortableElement);
|
1002 |
|
1003 | return _possibleConstructorReturn(this, _getPrototypeOf(WithSortableElement).apply(this, arguments));
|
1004 | }
|
1005 |
|
1006 | _createClass(WithSortableElement, [{
|
1007 | key: "componentDidMount",
|
1008 | value: function componentDidMount() {
|
1009 | var _this$props = this.props,
|
1010 | collection = _this$props.collection,
|
1011 | disabled = _this$props.disabled,
|
1012 | index = _this$props.index;
|
1013 |
|
1014 | if (!disabled) {
|
1015 | this.setDraggable(collection, index);
|
1016 | }
|
1017 | }
|
1018 | }, {
|
1019 | key: "componentWillReceiveProps",
|
1020 | value: function componentWillReceiveProps(nextProps) {
|
1021 | if (this.props.index !== nextProps.index && this.node) {
|
1022 | this.node.sortableInfo.index = nextProps.index;
|
1023 | }
|
1024 |
|
1025 | if (this.props.disabled !== nextProps.disabled) {
|
1026 | var collection = nextProps.collection,
|
1027 | disabled = nextProps.disabled,
|
1028 | index = nextProps.index;
|
1029 |
|
1030 | if (disabled) {
|
1031 | this.removeDraggable(collection);
|
1032 | } else {
|
1033 | this.setDraggable(collection, index);
|
1034 | }
|
1035 | } else if (this.props.collection !== nextProps.collection) {
|
1036 | this.removeDraggable(this.props.collection);
|
1037 | this.setDraggable(nextProps.collection, nextProps.index);
|
1038 | }
|
1039 | }
|
1040 | }, {
|
1041 | key: "componentWillUnmount",
|
1042 | value: function componentWillUnmount() {
|
1043 | var _this$props2 = this.props,
|
1044 | collection = _this$props2.collection,
|
1045 | disabled = _this$props2.disabled;
|
1046 |
|
1047 | if (!disabled) {
|
1048 | this.removeDraggable(collection);
|
1049 | }
|
1050 | }
|
1051 | }, {
|
1052 | key: "setDraggable",
|
1053 | value: function setDraggable(collection, index) {
|
1054 | var node = findDOMNode(this);
|
1055 | node.sortableInfo = {
|
1056 | index: index,
|
1057 | collection: collection,
|
1058 | manager: this.context.manager
|
1059 | };
|
1060 | this.node = node;
|
1061 | this.ref = {
|
1062 | node: node
|
1063 | };
|
1064 | this.context.manager.add(collection, this.ref);
|
1065 | }
|
1066 | }, {
|
1067 | key: "removeDraggable",
|
1068 | value: function removeDraggable(collection) {
|
1069 | this.context.manager.remove(collection, this.ref);
|
1070 | }
|
1071 | }, {
|
1072 | key: "getWrappedInstance",
|
1073 | value: function getWrappedInstance() {
|
1074 | invariant(config.withRef, 'To access the wrapped instance, you need to pass in {withRef: true} as the second argument of the SortableElement() call');
|
1075 | return this.refs.wrappedInstance;
|
1076 | }
|
1077 | }, {
|
1078 | key: "render",
|
1079 | value: function render() {
|
1080 | var ref = config.withRef ? 'wrappedInstance' : null;
|
1081 | return createElement(WrappedComponent, _extends({
|
1082 | ref: ref
|
1083 | }, omit(this.props, 'collection', 'disabled', 'index')));
|
1084 | }
|
1085 | }]);
|
1086 |
|
1087 | return WithSortableElement;
|
1088 | }(Component), _defineProperty(_class, "displayName", provideDisplayName('sortableElement', WrappedComponent)), _defineProperty(_class, "contextTypes", {
|
1089 | manager: PropTypes.object.isRequired
|
1090 | }), _defineProperty(_class, "propTypes", {
|
1091 | index: PropTypes.number.isRequired,
|
1092 | collection: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
|
1093 | disabled: PropTypes.bool
|
1094 | }), _defineProperty(_class, "defaultProps", {
|
1095 | collection: 0
|
1096 | }), _temp;
|
1097 | }
|
1098 |
|
1099 | function sortableHandle(WrappedComponent) {
|
1100 | var _class, _temp;
|
1101 |
|
1102 | var config = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {
|
1103 | withRef: false
|
1104 | };
|
1105 | return _temp = _class = function (_React$Component) {
|
1106 | _inherits(WithSortableHandle, _React$Component);
|
1107 |
|
1108 | function WithSortableHandle() {
|
1109 | _classCallCheck(this, WithSortableHandle);
|
1110 |
|
1111 | return _possibleConstructorReturn(this, _getPrototypeOf(WithSortableHandle).apply(this, arguments));
|
1112 | }
|
1113 |
|
1114 | _createClass(WithSortableHandle, [{
|
1115 | key: "componentDidMount",
|
1116 | value: function componentDidMount() {
|
1117 | var node = findDOMNode(this);
|
1118 | node.sortableHandle = true;
|
1119 | }
|
1120 | }, {
|
1121 | key: "getWrappedInstance",
|
1122 | value: function getWrappedInstance() {
|
1123 | invariant(config.withRef, 'To access the wrapped instance, you need to pass in {withRef: true} as the second argument of the SortableHandle() call');
|
1124 | return this.refs.wrappedInstance;
|
1125 | }
|
1126 | }, {
|
1127 | key: "render",
|
1128 | value: function render() {
|
1129 | var ref = config.withRef ? 'wrappedInstance' : null;
|
1130 | return createElement(WrappedComponent, _extends({
|
1131 | ref: ref
|
1132 | }, this.props));
|
1133 | }
|
1134 | }]);
|
1135 |
|
1136 | return WithSortableHandle;
|
1137 | }(Component), _defineProperty(_class, "displayName", provideDisplayName('sortableHandle', WrappedComponent)), _temp;
|
1138 | }
|
1139 |
|
1140 | export { sortableContainer as SortableContainer, sortableContainer, sortableElement as SortableElement, sortableElement, sortableHandle as SortableHandle, sortableHandle, arrayMove };
|