react-virtual-drag-list - npm Package Compare versions

Comparing version 2.6.1 to 2.6.2

dist/virtual-drag-list.min.js

 /*!
- * react-virtual-drag-list v2.6.1
+ * react-virtual-drag-list v2.6.2
  * open source under the MIT license
  * https://github.com/mfuu/react-virtual-drag-list#readme
  */
-!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e(require("react")):"function"==typeof define&&define.amd?define(["react"],e):(t="undefined"!=typeof globalThis?globalThis:t||self).VirtualDragList=e(t.React)}(this,(function(t){"use strict";function e(t){return t&&"object"==typeof t&&"default"in t?t:{default:t}}var n=e(t);function o(t,e){var n=Object.keys(t);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(t);e&&(o=o.filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),n.push.apply(n,o)}return n}function i(t){for(var e=1;e<arguments.length;e++){var n=null!=arguments[e]?arguments[e]:{};e%2?o(Object(n),!0).forEach((function(e){s(t,e,n[e])})):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(n)):o(Object(n)).forEach((function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(n,e))}))}return t}function r(t){return r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},r(t)}function s(t,e,n){return e in t?Object.defineProperty(t,e,{value:n,enumerable:!0,configurable:!0,writable:!0}):t[e]=n,t}function l(t,e){return function(t){if(Array.isArray(t))return t}(t)||function(t,e){var n=null==t?null:"undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(null==n)return;var o,i,r=[],s=!0,l=!1;try{for(n=n.call(t);!(s=(o=n.next()).done)&&(r.push(o.value),!e||r.length!==e);s=!0);}catch(t){l=!0,i=t}finally{try{s||null==n.return||n.return()}finally{if(l)throw i}}return r}(t,e)||c(t,e)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function a(t){return function(t){if(Array.isArray(t))return u(t)}(t)||function(t){if("undefined"!=typeof Symbol&&null!=t[Symbol.iterator]||null!=t["@@iterator"])return Array.from(t)}(t)||c(t)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function c(t,e){if(t){if("string"==typeof t)return u(t,e);var n=Object.prototype.toString.call(t).slice(8,-1);return"Object"===n&&t.constructor&&(n=t.constructor.name),"Map"===n||"Set"===n?Array.from(t):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?u(t,e):void 0}}function u(t,e){(null==e||e>t.length)&&(e=t.length);for(var n=0,o=new Array(e);n<e;n++)o[n]=t[n];return o}"undefined"!=typeof globalThis?globalThis:"undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self&&self;function h(t){return t&&t.__esModule&&Object.prototype.hasOwnProperty.call(t,"default")?t.default:t}var d={exports:{}};!function(t,e){t.exports=function(){function t(e){return(t="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t})(e)}function e(){return(e=Object.assign?Object.assign.bind():function(t){for(var e=1;e<arguments.length;e++){var n,o=arguments[e];for(n in o)Object.prototype.hasOwnProperty.call(o,n)&&(t[n]=o[n])}return t}).apply(this,arguments)}var n={capture:!1,passive:!1},o=/\s+/g;function i(t){if("undefined"!=typeof window&&window.navigator)return!!navigator.userAgent.match(t)}var r,s,l=i(/(?:Trident.*rv[ :]?11\.|msie|iemobile|Windows Phone)/i),a=i(/Edge/i),c=i(/safari/i)&&!i(/chrome/i)&&!i(/android/i),u=(r=!1,document.addEventListener("checkIfSupportPassive",null,{get passive(){return r=!0}}),r),h="undefined"==typeof window||"undefined"==typeof document?{}:(s=window.getComputedStyle(document.documentElement,"")||["-moz-hidden-iframe"],s=(Array.prototype.slice.call(s).join("").match(/-(moz|webkit|ms)-/)||""===s.OLink&&["","o"])[1],{dom:"WebKit|Moz|MS|O".match(new RegExp("("+s+")","i"))[1],lowercase:s,css:"-"+s+"-",js:s[0].toUpperCase()+s.substr(1)});function d(t,e){t.style["".concat(h.css,"transition-duration")]=null==e?"":"".concat(e,"ms")}function f(t,e){t.style["".concat(h.css,"transform")]=e?"".concat(e):""}function p(t,e,o){window.addEventListener?t.addEventListener(e,o,!(!u&&l)&&n):window.attachEvent?t.attachEvent("on"+e,o):t["on"+e]=o}function m(t,e,o){window.removeEventListener?t.removeEventListener(e,o,!(!u&&l)&&n):window.detachEvent?t.detachEvent("on"+e,o):t["on"+e]=null}function g(){return document.scrollingElement||document.documentElement}function v(t,e,n){if(t.getBoundingClientRect||t===window){var o,i,r,s,l,a,c=t!==window&&t.parentNode&&t!==g()?(i=(o=t.getBoundingClientRect()).top,r=o.left,s=o.bottom,l=o.right,a=o.height,o.width):(r=i=0,s=window.innerHeight,l=window.innerWidth,a=window.innerHeight,window.innerWidth);if(e&&t!==window){n=n||t.parentNode;do{if(n&&n.getBoundingClientRect){var u=n.getBoundingClientRect();i-=u.top+parseInt(O(n,"border-top-width")),r-=u.left+parseInt(O(n,"border-left-width")),s=i+o.height,l=r+o.width;break}}while(n=n.parentNode)}return{top:i,left:r,bottom:s,right:l,width:c,height:a}}}function y(t,e,n,o){if(t){n=n||document;do{if(null==e){var i=Array.prototype.slice.call(n.children),r=i.indexOf(t);if(-1<r)return i[r];for(var s=0;s<i.length;s++)if(b(t,i[s]))return i[s]}else if((">"!==e[0]||t.parentNode===n)&&T(t,e)||o&&t===n)return t}while(t=t.parentNode)}return null}function b(t,e){if(t&&e){if(e.compareDocumentPosition)return e===t||16&e.compareDocumentPosition(t);if(e.contains&&1===t.nodeType)return e.contains(t)&&e!==t;for(;t=t.parentNode;)if(t===e)return 1}}function S(t,e){var n=0;if(!t||!t.parentNode)return-1;for(;t=t.previousElementSibling;)"TEMPLATE"===t.nodeName.toUpperCase()||e&&!T(t,e)||"none"===O(t,"display")||n++;return n}function w(t,e,n,o){for(var i=0,r=0,s=t.children;i<s.length;){if(s[i]!==ot.ghost&&"none"!==O(s[i],"display")&&y(s[i],n,t,!1)&&(o||s[i]!==ot.dragged)){if(r===e)return s[i];r++}i++}return null}function x(t,e){var n,o=O(t),i=parseInt(o.width)-parseInt(o.paddingLeft)-parseInt(o.paddingRight)-parseInt(o.borderLeftWidth)-parseInt(o.borderRightWidth),r=w(t,0,e),s=(t=w(t,1,e),e=r&&O(r),t&&O(t)),c=e&&parseInt(e.marginLeft)+parseInt(e.marginRight)+v(r).width,u=s&&parseInt(s.marginLeft)+parseInt(s.marginRight)+v(t).width,h=a||l?"cssFloat":"float";return"flex"===o.display?"column"===o.flexDirection||"column-reverse"===o.flexDirection?"vertical":"horizontal":"grid"===o.display?o.gridTemplateColumns.split(" ").length<=1?"vertical":"horizontal":r&&e.float&&"none"!==e.float?(n="left"===e.float?"left":"right",!t||"both"!==s.clear&&s.clear!==n?"horizontal":"vertical"):r&&("block"===e.display||"flex"===e.display||"table"===e.display||"grid"===e.display||i<=c&&"none"===o[h]||t&&"none"===o[h]&&i<c+u)?"vertical":"horizontal"}function E(t,e,n){var i;t&&e&&(t.classList?t.classList[n?"add":"remove"](e):(i=(" "+t.className+" ").replace(o," ").replace(" "+e+" "," "),t.className=(i+(n?" "+e:"")).replace(o," ")))}function T(t,e){if(e&&(">"===e[0]&&(e=e.substring(1)),t))try{if(t.matches)return t.matches(e);if(t.msMatchesSelector)return t.msMatchesSelector(e);if(t.webkitMatchesSelector)return t.webkitMatchesSelector(e)}catch(t){return}}function O(t,e,n){var o=t&&t.style;if(o){if(void 0===n)return document.defaultView&&document.defaultView.getComputedStyle?n=document.defaultView.getComputedStyle(t,""):t.currentStyle&&(n=t.currentStyle),void 0===e?n:n[e];o[e=e in o||-1!==e.indexOf("webkit")?e:"-webkit-"+e]=n+("string"==typeof n?"":"px")}}function z(t,e){return 2===(t=t.compareDocumentPosition?t.compareDocumentPosition(e):t.contains?(t!=e&&t.contains(e)&&16)+(t!=e&&e.contains(t)&&8)+(0<=t.sourceIndex&&0<=e.sourceIndex?(t.sourceIndex<e.sourceIndex&&4)+(t.sourceIndex>e.sourceIndex&&2):1)+0:0)?1:4===t?-1:0}function I(t){void 0!==t.preventDefault&&t.cancelable&&t.preventDefault()}function _(t){var n=t.sortable,o=t.name;t=t.params,"function"==typeof(n=n.options[o])&&n(e({},t))}var D,C,M="Sortable"+Date.now();function N(t){this.options=t,this.autoScrollAnimationFrame=null}function R(t){this.options=t,this.animations=[]}function k(t){this.options=t||{},this.selectedElements=[]}window.requestAnimationFrame||(window.requestAnimationFrame=function(t){return setTimeout(t,17)}),window.cancelAnimationFrame||(window.cancelAnimationFrame=function(t){clearTimeout(t)}),N.prototype={destroy:function(){null!=this.autoScrollAnimationFrame&&(cancelAnimationFrame(this.autoScrollAnimationFrame),this.autoScrollAnimationFrame=null)},update:function(t,e,n){var o=this;cancelAnimationFrame(this.autoScrollAnimationFrame),this.autoScrollAnimationFrame=requestAnimationFrame((function(){e&&n&&o.autoScroll(t,n),o.update(t,e,n)}))},autoScroll:function(t,e){var n,o,i,r,s,l,a,c,u,h,d,f,p;t&&void 0!==e.clientX&&void 0!==e.clientY&&(h=v(t))&&(n=e.clientX,e=e.clientY,o=h.top,i=h.right,r=h.bottom,s=h.left,f=h.height,h=h.width,e<o||i<n||r<e||n<s||(l=(a=this.options).scrollThreshold,a=a.scrollSpeed,d=t.scrollTop,c=t.scrollLeft,p=t.scrollHeight,u=0<d&&o<=e&&e<=o+l,h=c+h<t.scrollWidth&&n<=i&&i-l<=n,d=d+f<p&&e<=r&&r-l<=e,(p=f=0)<c&&s<=n&&n<=s+l&&(f=Math.floor(Math.max(-1,(n-s)/l-1)*a.x)),h&&(f=Math.ceil(Math.min(1,(n-i)/l+1)*a.x)),u&&(p=Math.floor(Math.max(-1,(e-o)/l-1)*a.y)),(p=d?Math.ceil(Math.min(1,(e-r)/l+1)*a.y):p)&&(t.scrollTop+=p),f&&(t.scrollLeft+=f)))}},R.prototype={collect:function(t){if(t){for(var e=v(t),n=window.innerWidth||document.documentElement.clientWidth||document.body.clientWidth,o=window.innerHeight||document.documentElement.clientHeight||document.body.clientHeight,i=Math.min(e.right,n),r=Math.min(e.bottom,o),s=Array.prototype.slice.call(t.children),l=[],a=0;a<=s.length;a++){var c=s[a];if(c&&c!==ot.ghost&&"none"!==O(c,"display")){var u=v(c);if(!(u.bottom<0||u.right<0)){if(u.top-u.height>r||u.left-u.width>i)break;l.push({node:c,rect:u})}}}this.animations.push(l)}},animate:function(){for(var t=this.animations.pop(),e=0,n=t.length;e<n;e++){var o=(i=t[e]).node,i=i.rect;this._excute(o,i)}},_excute:function(t,e){var n=e.left,o=(e=e.top,v(t));o.top===e&&o.left===n||(e-=o.top,n-=o.left,d(t),f(t,"translate3d(".concat(n,"px, ").concat(e,"px, 0)")),t.offsetWidth,d(t,this.options.animation),f(t,"translate3d(0px, 0px, 0px)"),clearTimeout(t.animated),t.animated=setTimeout((function(){d(t),f(t,""),t.animated=null}),this.options.animation))}},k.prototype={destroy:function(){D=C=null},active:function(){return!!D},setParams:function(t){t.nodes=D||[],t.clones=C||[]},select:function(t){E(t,this.options.selectedClass,!0),this.selectedElements.push(t),this.selectedElements.sort(z)},deselect:function(t){var e=this.selectedElements.indexOf(t);-1<e&&(E(t,this.options.selectedClass,!1),this.selectedElements.splice(e,1))},getGhostElement:function(){var t;return D?(t=document.createElement("div"),this.selectedElements.forEach((function(e,n){(e=e.cloneNode(!0)).style="position: absolute;left: 0;top: 0;bottom: 0;right: 0;opacity: ".concat(0===n?1:.5,";z-index: ").concat(n,";"),t.appendChild(e)})),t):null},toggleSelected:function(t,e){var n=this;e?t.forEach((function(t){return n.selectedElements.push(t)})):this.selectedElements=this.selectedElements.filter((function(e){return t.indexOf(e)<0}))},toggleClass:function(t){if(D)for(var e=0;e<D.length;e++)E(D[e],this.options.chosenClass,t)},toggleVisible:function(t){D&&(t?(t=D.indexOf(ot.dragged),this._viewElements(D,t,ot.dragged)):this._hideElements(D))},onChoose:function(){!this.options.multiple||!this.selectedElements.length||this.selectedElements.indexOf(ot.dragged)<0||(this.selectedElements.sort(z),D=this.selectedElements,this.toggleClass(!0))},onDrag:function(t){D&&(t.animator.collect(ot.dragged.parentNode),this._hideElements(D),t.animator.animate(),this.toggleClass(!1))},onDrop:function(t,e,n){var o,i,r;D&&(i=ot.clone,r=D.indexOf(o=ot.dragged),e[M].animator.collect(i.parentNode),t!==e&&"clone"===n?(O(i,"display","none"),C=D.map((function(t){return t.cloneNode(!0)})),this._viewElements(C,r,i),this._viewElements(D,r,o)):this._viewElements(D,r,i),e[M].animator.animate(),t!==e)&&(e[M].multiplayer.toggleSelected(C||D,!0),"clone"!==n)&&t[M].multiplayer.toggleSelected(D,!1)},onSelect:function(t,e,n){var o=this.selectedElements.indexOf(e);E(e,this.options.selectedClass,o<0),t={from:n.el,event:t,node:e,index:S(e)},o<0?(this.selectedElements.push(e),_({sortable:n,name:"onSelect",params:t})):(this.selectedElements.splice(o,1),_({sortable:n,name:"onDeselect",params:t})),this.selectedElements.sort(z)},_viewElements:function(t,e,n){for(var o,i=0;i<t.length;i++)O(t[i],"display",""),i<e?n.parentNode.insertBefore(t[i],n):(o=0<i?t[i-1]:n,n.parentNode.insertBefore(t[i],o.nextSibling))},_hideElements:function(t){for(var e=0;e<t.length;e++)t[e]!=ot.dragged&&O(t[e],"display","none")}};var A,j,B,P,F,K,L,X,H,Y,W,U,q,G,V,Z,$,J,Q,tt,et=[],nt=function(e){var n={},o=e.group;o&&"object"==t(o)||(o={name:o,pull:!0,put:!0,revertDrag:!0}),n.name=o.name,n.pull=o.pull,n.put=o.put,n.revertDrag=o.revertDrag,e.group=n};function ot(t,n){if(!t||!t.nodeType||1!==t.nodeType)throw"Sortable-dnd: `el` must be an HTMLElement, not ".concat({}.toString.call(t));(t[M]=this).el=t,this.options=n=e({},n);var o,i,r={store:null,disabled:!1,group:"",animation:150,draggable:null,handle:null,multiple:!1,selectHandle:null,customGhost:null,direction:function(){return x(t,n.draggable)},autoScroll:!0,scrollThreshold:55,scrollSpeed:{x:10,y:10},delay:0,delayOnTouchOnly:!1,touchStartThreshold:(Number.parseInt?Number:window).parseInt(window.devicePixelRatio,10)||1,ghostClass:"",ghostStyle:{},chosenClass:"",selectedClass:"",swapOnDrop:!0,fallbackOnBody:!1,supportTouch:"ontouchstart"in window,emptyInsertThreshold:-5};for(o in r)o in this.options||(this.options[o]=r[o]);for(i in nt(n),this)"_"===i.charAt(0)&&"function"==typeof this[i]&&(this[i]=this[i].bind(this));var s=this.options.supportTouch;p(t,s?"touchstart":"mousedown",this._onDrag),et.push(t),this.autoScroller=new N(this.options),this.multiplayer=new k(this.options),this.animator=new R(this.options)}return ot.prototype={constructor:ot,_onDrag:function(t){var e,n,o,i,r=this;j||this.options.disabled||!this.options.group.pull||/mousedown|pointerdown/.test(t.type)&&0!==t.button||(o=((e=t.touches&&t.touches[0])||t).target,c&&o&&"SELECT"===o.tagName.toUpperCase())||!(n=y(o,this.options.draggable,this.el))||n.animated||(X={original:t,clientX:(e||t).clientX,clientY:(e||t).clientY},j=n,p(W=e?j:document,"mouseup",this._onDrop),p(W,"touchend",this._onDrop),p(W,"touchcancel",this._onDrop),i=(n=this.options).handle,"function"==typeof(n=n.selectHandle)&&n(t))||"string"==typeof n&&T(o,n)||"function"==typeof i&&!i(t)||"string"==typeof i&&!T(o,i)||(o=(n=this.options).delay,i=n.delayOnTouchOnly,!o||i&&!e||a||l?this._onStart(e,t):(p(this.el.ownerDocument,"touchmove",this._delayMoveHandler),p(this.el.ownerDocument,"mousemove",this._delayMoveHandler),p(this.el.ownerDocument,"mouseup",this._cancelStart),p(this.el.ownerDocument,"touchend",this._cancelStart),p(this.el.ownerDocument,"touchcancel",this._cancelStart),q=setTimeout((function(){return r._onStart(e,t)}),o)))},_delayMoveHandler:function(t){t=t.touches?t.touches[0]:t,Math.max(Math.abs(t.clientX-X.clientX),Math.abs(t.clientY-X.clientY))>=Math.floor(this.options.touchStartThreshold/(window.devicePixelRatio||1))&&this._cancelStart()},_cancelStart:function(){clearTimeout(q),m(this.el.ownerDocument,"touchmove",this._delayMoveHandler),m(this.el.ownerDocument,"mousemove",this._delayMoveHandler),m(this.el.ownerDocument,"mouseup",this._cancelStart),m(this.el.ownerDocument,"touchend",this._cancelStart),m(this.el.ownerDocument,"touchcancel",this._cancelStart)},_onStart:function(t,e){var n=S(j);G=this.el,V=this.el,Q=J=$=n,tt=j,A=this.el,F=j.cloneNode(!0),L=j.parentNode,Z=this.options.group.pull,ot.clone=F,ot.active=this,E(ot.dragged=j,this.options.chosenClass,!0),this.multiplayer.onChoose(),_({sortable:this,name:"onChoose",params:this._getParams(e)}),p(W,t?"touchmove":"mousemove",this._nearestSortable);try{document.selection?setTimeout((function(){return document.selection.empty()}),0):window.getSelection().removeAllRanges()}catch(t){}},_onStarted:function(){E(F,this.options.chosenClass,!0),this._appendGhost(),this.multiplayer.onDrag(this),_({sortable:this,name:"onDrag",params:this._getParams(X.original)}),O(j,"display","none"),E(j,this.options.chosenClass,!1),j.parentNode.insertBefore(F,j),c&&O(document.body,"user-select","none")},_getGhostElement:function(){var t=this.options.customGhost;return"function"==typeof t?t((t=this.multiplayer.selectedElements).length?t:[j]):this.multiplayer.getGhostElement()||j},_appendGhost:function(){if(!K){var t,n=(i=this.options).fallbackOnBody,o=i.ghostClass,i=i.ghostStyle,r=(n=n?document.body:this.el,this._getGhostElement()),s=e({position:"fixed",top:(E(K=r.cloneNode(!0),o,!0),r=v(j)).top,left:r.left,width:r.width,height:r.height,minWidth:r.width,minHeight:r.height,opacity:"0.8",overflow:"hidden","z-index":"100000","box-sizing":"border-box","pointer-events":"none"},i);for(t in s)O(K,t,s[t]);o="none",K.style["".concat(h.css,"transition")]=o?"none"===o?"none":"".concat(o):"",f(K,"translate3d(0px, 0px, 0px)"),ot.ghost=K,n.appendChild(K),i=(X.clientX-r.left)/parseInt(K.style.width)*100,o=(X.clientY-r.top)/parseInt(K.style.height)*100,O(K,"transform-origin","".concat(i,"% ").concat(o,"%")),O(K,"transform","translateZ(0)"),O(K,"will-change","transform")}},_nearestSortable:function(t){I(t);var e,n,o,i,r,s=t.touches&&t.touches[0],l=s||t;!X||!j||(n=H||X,void 0!==(e=l).clientX&&void 0!==e.clientY&&Math.abs(e.clientX-n.clientX)<=0&&Math.abs(e.clientY-n.clientY)<=0)||(H||this._onStarted(),H={original:t,clientX:l.clientX,clientY:l.clientY},e=s?document.elementFromPoint(l.clientX,l.clientY):l.target,n=l.clientX-X.clientX,s=l.clientY-X.clientY,f(K,"translate3d(".concat(n,"px, ").concat(s,"px, 0)")),this.options.autoScroll&&(n=function(t,e){if(t&&t.getBoundingClientRect){var n=t,o=!1;do{if(n.clientWidth<n.scrollWidth||n.clientHeight<n.scrollHeight){var i=O(n);if(n.clientWidth<n.scrollWidth&&("auto"==i.overflowX||"scroll"==i.overflowX)||n.clientHeight<n.scrollHeight&&("auto"==i.overflowY||"scroll"==i.overflowY)){if(!n.getBoundingClientRect||n===document.body)return g();if(o||e)return n;o=!0}}}while(n=n.parentNode)}return g()}(e,!0),this.autoScroller.update(n,X,H)),o=l.clientX,i=l.clientY,et.some((function(t){var e,n,s=t[M].options.emptyInsertThreshold;if(null!=s)return n=v(t),e=o>=n.left-s&&o<=n.right+s,n=i>=n.top-s&&i<=n.bottom+s,e&&n?r=t:void 0})),r&&r[M]._onMove(t,e))},_allowPut:function(){var t,e,n;return A===this.el||!!this.options.group.put&&(t=(e=this.options.group).name,e=e.put,n=A[M].options.group,e.join&&-1<e.indexOf(n.name)||n.name&&t&&n.name===t)},_allowSwap:function(){var t=z(F,B),e=(P=t<0?B.nextSibling:B,v(B)),n="vertical"===(i="function"==typeof this.options.direction?this.options.direction.call(H.original,j,this):this.options.direction),o=n?H.clientY:H.clientX,i=B["vertical"===i?"offsetHeight":"offsetWidth"];return o=o>=(n?e.top:e.left)&&o<(n?e.bottom:e.right)-i/2?-1:1,Y!==B?(U=o,!0):U!==o&&((U=o)<0?0<t:t<0)},_onMove:function(t,e){var n,o;this._allowPut()&&(_({sortable:this,name:"onMove",params:this._getParams(t)}),this.el===V||e!==this.el&&function(t,e){for(var n=t.lastElementChild;n&&(n===ot.ghost||"none"===O(n,"display")||e&&!T(n,e));)n=n.previousElementSibling;return n}(this.el)?(B=y(e,this.options.draggable,this.el))&&!B.animated&&this._allowSwap()&&(B===F||b(B,F)||(this.el!==V?this._onInsert(t):(n=t,o=o||v(L),n.clientX<=o.right&&n.clientX>=o.left&&n.clientY>=o.top&&n.clientY<=o.bottom&&e===L||this._onChange(t))),Y=B):(B=Y=null,this._onInsert(t)))},_onInsert:function(t){var e=B||F,n="clone"===Z&&this.el!==A&&V===A,o="clone"===Z&&this.el===A&&V!==A;G=this.el,$=S(F),tt=e,L=B?B.parentNode:this.el,V[M].animator.collect(F.parentNode),this.animator.collect(L),n&&(O(j,"display",""),A[M].multiplayer.toggleVisible(!0),A[M].options.group.revertDrag||V.insertBefore(j,F)),o&&($=S(j),O(j,"display","none"),this.multiplayer.toggleVisible(!1)),B?L.insertBefore(F,U<0?B:B.nextSibling):L.appendChild(F),J=S(F),n&&A[M].options.group.revertDrag&&_({sortable:A[M],name:"onChange",params:this._getParams(t,{to:A,target:j,newIndex:Q,revertDrag:!0})}),n||_({sortable:V[M],name:"onRemove",params:this._getParams(t)}),o&&B!==j&&_({sortable:this,name:"onChange",params:this._getParams(t,{from:A,backToOrigin:!0})}),o||_({sortable:this,name:"onAdd",params:this._getParams(t)}),V[M].animator.animate(),this.animator.animate(),V=this.el},_onChange:function(t){B!==j&&(L=B.parentNode,$=S(F),tt=B,this.animator.collect(L),L.insertBefore(F,P),J=S(F),_({sortable:this,name:"onChange",params:this._getParams(t)}),this.animator.animate(),V=this.el)},_onDrop:function(t){var e,n;I(t),this._cancelStart(),m(W,"touchmove",this._nearestSortable),m(W,"mousemove",this._nearestSortable),m(W,"mouseup",this._onDrop),m(W,"touchend",this._onDrop),m(W,"touchcancel",this._onDrop),E(j,this.options.chosenClass,!1),A&&(V=A,$=Q,tt===F&&(tt=j),this.multiplayer.toggleClass(!1),_({sortable:this,name:"onUnchoose",params:this._getParams(t)}),H)&&this._onEnd(t),A||H||!this.options.multiple||(n=(e=t.changedTouches?t.changedTouches[0]:t).clientX-X.clientX,e=e.clientY-X.clientY,0<=(n=Math.sqrt(n*n+e*e))&&n<=1&&this.multiplayer.onSelect(t,j,this)),K&&K.parentNode&&K.parentNode.removeChild(K),this.multiplayer.destroy(),this.autoScroller.destroy(),this._nulling()},_onEnd:function(t){t=this._getParams(t);var e=(this.multiplayer.onDrop(V,G,Z),this.options.swapOnDrop);("clone"!==Z||V===G)&&("function"==typeof e?e(t):e)&&L.insertBefore(j,F),"clone"!==Z||V===G||this.multiplayer.active()?F&&F.parentNode&&F.parentNode.removeChild(F):E(F,this.options.chosenClass,!1),O(j,"display",""),c&&O(document.body,"user-select",""),V!==G&&_({sortable:V[M],name:"onDrop",params:t}),_({sortable:G[M],name:"onDrop",params:t})},_getParams:function(t){var n=1<arguments.length&&void 0!==arguments[1]?arguments[1]:{},o={};return o.event=t,o.to=G,o.from=V,o.node=j,o.clone=F,o.target=tt,o.oldIndex=$,o.newIndex=J,o.pullMode=Z,this.multiplayer.setParams(o),e(o,n),o.relative=o.target===j?0:z(o.target,F),o},_nulling:function(){G=V=A=j=B=P=F=K=L=Z=$=J=Q=X=H=tt=Y=W=U=q=ot.clone=ot.ghost=ot.active=ot.dragged=null},destroy:function(){this._nulling(),this._cancelStart(),m(this.el,"touchstart",this._onDrag),m(this.el,"mousedown",this._onDrag),et.splice(et.indexOf(this.el),1),this.el[M]=this.animator=this.multiplayer=this.autoScroller=null},option:function(t,e){if(void 0===e)return this.options[t];this.options[t]=e,this.animator.options[t]=e,this.multiplayer.options[t]=e,this.autoScroller.options[t]=e,"group"===t&&nt(this.options)},select:function(t){this.multiplayer.select(t)},deselect:function(t){this.multiplayer.deselect(t)},getSelectedElements:function(){return this.multiplayer.selectedElements}},ot.utils={on:p,off:m,css:O,index:S,closest:y,getRect:v,toggleClass:E,detectDirection:x},ot.get=function(t){return t[M]},ot.create=function(t,e){return new ot(t,e)},ot}()}(d);var f=h(d.exports),p=n.default.memo((function(t){var e=t.dataKey,o=t.children,i=t.onSizeChange,s=t.sizeKey,l=n.default.useRef(null),a="function"==typeof o?o(l):o;return n.default.useLayoutEffect((function(){var t;return void 0!==("undefined"==typeof ResizeObserver?"undefined":r(ResizeObserver))&&(t=new ResizeObserver((function(){var t=l.current[s];i&&i(e,t)})),l.current&&t.observe(l.current)),function(){t&&(t.disconnect(),t=null)}}),[l]),n.default.cloneElement(a,{ref:l})})),m=n.default.memo((function(t){var e=t.Tag,o=void 0===e?"div":e,i=t.children;return n.default.createElement(p,{dataKey:t.dataKey,sizeKey:t.sizeKey,onSizeChange:t.onSizeChange},n.default.createElement(o,{className:t.className,style:t.style,"data-key":t.dataKey,"data-index":t.index},"function"==typeof i?i(t.record,t.index,t.dataKey):i))})),g=n.default.memo((function(t){var e=t.Tag,o=void 0===e?"div":e,i=t.children;return i?n.default.createElement(p,{dataKey:t.dataKey,sizeKey:t.sizeKey,onSizeChange:t.onSizeChange},n.default.createElement(o,{role:t.dataKey,style:t.style,className:t.className},i)):null}));function v(t,e){var n=null,o=function(){for(var o=this,i=arguments.length,r=new Array(i),s=0;s<i;s++)r[s]=arguments[s];n||(e<=0?t.apply(this,r):n=setTimeout((function(){n=void 0,t.apply(o,r)}),e))};return o.cancel=function(){n&&(clearTimeout(n),n=null)},o}function y(t,e){var n=v(t,e),o=function(){n.cancel(),n.apply(this,arguments)};return o.cancel=function(){n.cancel()},o}function b(t,e){return(Array.isArray(e)?e:e.replace(/\[/g,".").replace(/\]/g,".").split(".")).reduce((function(t,e){return(t||{})[e]}),t)}var S,w,x,E,T=["delay","group","handle","disabled","draggable","animation","autoScroll","ghostClass","ghostStyle","chosenClass","fallbackOnBody","scrollThreshold","delayOnTouchOnly"];function O(t,e){this.el=t,this.options=e,this.list=[],this.store={},this.reRendered=!1,this.attrs=T,this.init()}O.prototype={constructor:O,destroy:function(){this.sortable&&this.sortable.destroy(),this.sortable=this.store=this.reRendered=null},option:function(t,e){"list"===t?this.list=a(e):this.sortable.option(t,e)},init:function(){for(var t=this,e={},n=0;n<T.length;n++){var o=T[n];e[o]=this.options[o]}this.sortable=new f(this.el,i(i({},e),{},{swapOnDrop:function(t){return t.from===t.to},onDrag:function(e){return t.onDrag(e)},onAdd:function(e){return t.onAdd(e)},onRemove:function(e){return t.onRemove(e)},onChange:function(e){return t.onChange(e)},onDrop:function(e){return t.onDrop(e)}})),this.list=a(this.options.list)},onDrag:function(t){var e=t.node.dataset.key,n=this.getIndex(this.list,e),o=this.list[n];this.store={item:o,key:e,origin:{index:n,list:this.list},from:{index:n,list:this.list},to:{index:n,list:this.list}},this.sortable.option("store",this.store),this.dispatchEvent("onDrag",{item:o,key:e,index:n})},onRemove:function(t){var e=t.node.dataset.key,n=this.getIndex(this.list,e),o=this.list[n];this.list.splice(n,1),Object.assign(this.store,{key:e,item:o}),this.sortable.option("store",this.store),this.dispatchEvent("onRemove",{item:o,key:e,index:n})},onAdd:function(t){var e=t.from,n=t.target,o=t.relative,i=f.get(e).option("store"),r=i.key,s=i.item,l=this.getIndex(this.list,n.dataset.key);0===o?l=this.list.length:-1===o&&(l+=1),this.list.splice(l,0,s),Object.assign(this.store,{to:{index:l,list:this.list}}),this.sortable.option("store",this.store),this.dispatchEvent("onAdd",{item:s,key:r,index:l})},onChange:function(t){var e=f.get(t.from).option("store");if(t.revertDrag)return this.list=a(this.options.list),void Object.assign(this.store,{from:e.origin});var n=t.node,o=t.target,i=t.relative,r=t.backToOrigin,s=this.getIndex(this.list,n.dataset.key),l=this.list[s],c=this.getIndex(this.list,o.dataset.key);r&&(1===i&&e.from.index<c&&(c-=1),-1===i&&e.from.index>c&&(c+=1)),this.list.splice(s,1),this.list.splice(c,0,l),Object.assign(this.store,{from:{index:c,list:this.list},to:{index:c,list:this.list}})},onDrop:function(t){var e,n,o=this.getStore(t),i=o.from,r=o.to,s=t.from!==t.to||i.origin.index!==r.to.index;(this.dispatchEvent("onDrop",{changed:s,list:this.list,item:i.item,key:i.key,from:i.origin,to:r.to}),t.from===this.el&&this.reRendered)&&(null===(e=f.dragged)||void 0===e||e.remove());t.from!==t.to&&"clone"===t.pullMode&&(null===(n=f.clone)||void 0===n||n.remove());this.reRendered=!1},getIndex:function(t,e){for(var n=0;n<t.length;n++)if(b(t[n],this.options.dataKey)==e)return n;return-1},getStore:function(t){return{from:f.get(t.from).option("store"),to:f.get(t.to).option("store")}},dispatchEvent:function(t,e){var n=this.options[t];n&&n(e)}};var z={INIT:"INIT",FIXED:"FIXED",DYNAMIC:"DYNAMIC"},I="FRONT",_="BEHIND",D="STATIONARY",C="horizontal",M="vertical",N=(s(S={},M,"scrollTop"),s(S,C,"scrollLeft"),S),R=(s(w={},M,"offsetTop"),s(w,C,"offsetLeft"),w),k=(s(x={},M,"scrollHeight"),s(x,C,"scrollWidth"),x),A=(s(E={},M,"offsetHeight"),s(E,C,"offsetWidth"),E);function j(t){this.options=t;var e={size:0,keeps:0,buffer:0,wrapper:null,scroller:null,direction:"vertical",uniqueKeys:[],debounceTime:null,throttleTime:null};for(var n in e)!(n in this.options)&&(this.options[n]=e[n]);this.sizes=new Map,this.range={start:0,end:0,front:0,behind:0},this.offset=0,this.calcType=z.INIT,this.calcSize={average:0,total:0,fixed:0,header:0},this.scrollEl=this.getScrollElement(t.scroller),this.direction="",this.useWindowScroll=null,this.onScroll=null,this.updateOnScrollFunction(),this.addScrollEventListener(),this.checkIfUpdate(0,t.keeps-1)}j.prototype={constructor:j,isFront:function(){return this.direction===I},isBehind:function(){return this.direction===_},isFixed:function(){return this.calcType===z.FIXED},getSize:function(t){return this.sizes.get(t)||this.getItemSize()},getOffset:function(){return this.scrollEl[N[this.options.direction]]},getScrollSize:function(){return this.scrollEl[k[this.options.direction]]},getClientSize:function(){return this.scrollEl[A[this.options.direction]]},scrollToOffset:function(t){this.scrollEl[N[this.options.direction]]=t},scrollToIndex:function(t){if(t>=this.options.uniqueKeys.length-1)this.scrollToBottom();else{var e=this.getOffsetByIndex(t);this.scrollToOffset(e)}},scrollToBottom:function(){var t=this,e=this.getScrollSize();this.scrollToOffset(e),setTimeout((function(){var e=t.getClientSize(),n=t.getScrollSize();t.getOffset()+e+1<n&&t.scrollToBottom()}),5)},option:function(t,e){var n=this,o=this.options[t];this.options[t]=e,"uniqueKeys"===t&&this.sizes.forEach((function(t,o){e.includes(o)||n.sizes.delete(o)})),"scroller"===t&&(o&&f.utils.off(o,"scroll",this.onScroll),this.scrollEl=this.getScrollElement(e),this.addScrollEventListener())},updateRange:function(t){if(t)this.handleUpdate(t.start,t.end);else{var e=this.range.start;e=Math.max(e,0),this.handleUpdate(e,this.getEndByStart(e))}},onItemResized:function(t,e){this.sizes.set(t,e),this.calcType===z.INIT?(this.calcType=z.FIXED,this.calcSize.fixed=e):this.isFixed()&&this.calcSize.fixed!==e&&(this.calcType=z.DYNAMIC,this.calcSize.fixed=void 0),this.calcType!==z.FIXED&&(this.calcSize.total=a(this.sizes.values()).reduce((function(t,e){return t+e}),0),this.calcSize.average=Math.round(this.calcSize.total/this.sizes.size))},onSlotResized:function(t,e){this.calcSize[t]=e},addScrollEventListener:function(){this.options.scroller&&f.utils.on(this.options.scroller,"scroll",this.onScroll)},removeScrollEventListener:function(){this.options.scroller&&f.utils.off(this.options.scroller,"scroll",this.onScroll)},updateOnScrollFunction:function(){var t=this,e=this.options,n=e.debounceTime,o=e.throttleTime;this.onScroll=n?y((function(){return t.handleScroll()}),n):o?v((function(){return t.handleScroll()}),o):function(){return t.handleScroll()}},handleScroll:function(){var t=this.getOffset(),e=this.getClientSize(),n=this.getScrollSize();t===this.offset?this.direction=D:this.direction=t<this.offset?I:_,this.offset=t;var o=this.isFront()&&t<=0,i=this.isBehind()&&e+t>=n;this.options.onScroll({top:o,bottom:i,offset:t,direction:this.direction}),this.isFront()?this.handleScrollFront():this.isBehind()&&this.handleScrollBehind()},handleScrollFront:function(){var t=this.getScrollItems();if(!(t>this.range.start)){var e=Math.max(t-this.options.buffer,0);this.checkIfUpdate(e,this.getEndByStart(e))}},handleScrollBehind:function(){var t=this.getScrollItems();t<this.range.start+this.options.buffer||this.checkIfUpdate(t,this.getEndByStart(t))},getScrollItems:function(){var t=this.offset-this.getScrollStartOffset();if(t<=0)return 0;if(this.isFixed())return Math.floor(t/this.calcSize.fixed);for(var e=0,n=this.options.uniqueKeys.length,o=0,i=0;e<=n;){if(o=e+Math.floor((n-e)/2),(i=this.getOffsetByIndex(o))===t)return o;i<t?e=o+1:i>t&&(n=o-1)}return e>0?--e:0},checkIfUpdate:function(t,e){var n=this.options.keeps;this.options.uniqueKeys.length<=n?(t=0,e=this.getLastIndex()):e-t<n-1&&(t=e-n+1),this.range.start!==t&&this.handleUpdate(t,e)},handleUpdate:function(t,e){this.range.start=t,this.range.end=e,this.range.front=this.getFrontOffset(),this.range.behind=this.getBehindOffset(),this.options.onUpdate(i({},this.range))},getFrontOffset:function(){return this.isFixed()?this.calcSize.fixed*this.range.start:this.getOffsetByIndex(this.range.start)},getBehindOffset:function(){var t=this.range.end,e=this.getLastIndex();return this.isFixed()?(e-t)*this.calcSize.fixed:(e-t)*this.getItemSize()},getOffsetByIndex:function(t){if(!t)return 0;for(var e=0,n=0;n<t;n++){var o=this.sizes.get(this.options.uniqueKeys[n]);e+="number"==typeof o?o:this.getItemSize()}return e},getEndByStart:function(t){return Math.min(t+this.options.keeps-1,this.getLastIndex())},getLastIndex:function(){var t=this.options,e=t.uniqueKeys,n=t.keeps;return e.length>0?e.length-1:n-1},getItemSize:function(){return this.isFixed()?this.calcSize.fixed:this.calcSize.average||this.options.size},getScrollElement:function(t){return t instanceof Document&&9===t.nodeType||t instanceof Window?(this.useWindowScroll=!0,document.scrollingElement||document.documentElement||document.body):(this.useWindowScroll=!1,t)},getScrollStartOffset:function(){var t=this.calcSize.header;if(this.useWindowScroll&&this.options.wrapper){var e=this.options.wrapper;do{t+=e[R[this.options.direction]]}while((e=e.offsetParent)&&e!==this.options.wrapper.ownerDocument)}return t}};var B={top:"v-top",bottom:"v-bottom",drag:"v-drag",drop:"v-drop",add:"v-add",remove:"v-remove"};function P(t,e){var o=t.keeps,i=void 0===o?30:o,r=t.dataKey,s=void 0===r?"":r,c=t.direction,u=void 0===c?"vertical":c,h=t.dataSource,d=void 0===h?[]:h,p=t.throttleTime,v=void 0===p?0:p,S=t.debounceTime,w=void 0===S?0:S,x=t.delay,E=void 0===x?0:x,T=t.animation,z=void 0===T?150:T,I=t.autoScroll,_=void 0===I||I,D=t.scrollThreshold,C=void 0===D?55:D,M=t.wrapTag,N=void 0===M?"div":M,R=t.rootTag,k=void 0===R?"div":R,A=t.itemTag,P=void 0===A?"div":A,F=t.headerTag,K=void 0===F?"div":F,L=t.footerTag,X=void 0===L?"div":L,H=t.style,Y=void 0===H?{}:H,W=t.itemStyle,U=void 0===W?{}:W,q=t.wrapStyle,G=void 0===q?{}:q,V=t.ghostStyle,Z=void 0===V?{}:V,$=l(n.default.useState(null),2),J=$[0],Q=$[1],tt=l(n.default.useState([]),2),et=tt[0],nt=tt[1],ot=l(n.default.useState({}),2),it=ot[0],rt=ot[1],st=n.default.useRef([]),lt=n.default.useRef(null),at=n.default.useRef({start:0,end:i-1,front:0,behind:0}),ct=n.default.useRef([]),ut=n.default.useRef(null),ht=n.default.useRef(null),dt=n.default.useRef(null),ft=n.default.useRef(null),pt=n.default.useRef(null),mt=n.default.useMemo((function(){var t="vertical"!==u;return{isHorizontal:t,itemSizeKey:t?"offsetWidth":"offsetHeight"}}),[u]),gt=mt.isHorizontal,vt=mt.itemSizeKey,yt=function(t){return pt.current.getSize(t)},bt=function(){return pt.current.getOffset()},St=function(){return pt.current.getClientSize()},wt=function(){return pt.current.getScrollSize()},xt=function(t){pt.current.scrollToOffset(t)},Et=function(t){pt.current.scrollToIndex(t)},Tt=function(t){var e=ct.current.indexOf(t);e>-1&&pt.current.scrollToIndex(e)},Ot=function(){xt(0)},zt=function(){pt.current.scrollToBottom()};n.default.useImperativeHandle(e,(function(){return{getSize:yt,getOffset:bt,getClientSize:St,getScrollSize:wt,scrollToTop:Ot,scrollToKey:Tt,scrollToIndex:Et,scrollToOffset:xt,scrollToBottom:zt}})),n.default.useLayoutEffect((function(){It()}),[]),n.default.useEffect((function(){return _t(),pt.current.option("wrapper",dt.current),t.scroller||pt.current.option("scroller",ht.current),function(){var t,e;null===(t=pt.current)||void 0===t||t.removeScrollEventListener(),null===(e=ft.current)||void 0===e||e.destroy()}}),[]),n.default.useEffect((function(){var e;null===(e=ft.current)||void 0===e||e.option("disabled",t.disabled)}),[t.disabled]),n.default.useEffect((function(){var e,n=a(st.current);if(st.current=d,Ct(),nt((function(){return Dt(n,st.current),a(d)})),null===(e=ft.current)||void 0===e||e.option("list",d),ut.current&&t.keepOffset){var o=Math.abs(d.length-ut.current);Et(o),ut.current=null}}),[d]);var It=function(){pt.current=new j({size:t.size,keeps:i,buffer:Math.round(i/3),scroller:t.scroller,direction:u,uniqueKeys:ct.current,debounceTime:w,throttleTime:v,onScroll:function(t){ut.current=null,st.current.length&&t.top?Rt():t.bottom&&kt()},onUpdate:function(t){f.dragged&&t.start!==at.current.start&&(ft.current.reRendered=!0),at.current=t,rt((function(){return t}))}})},_t=function(){ft.current=new O(dt.current,Object.assign(Object.assign({},t),{list:st.current,delay:E,animation:z,autoScroll:_,ghostStyle:Z,scrollThreshold:C,onDrag:function(t){lt.current=at.current.start,Nt("drag",t),Q((function(){return f.dragged}))},onAdd:function(t){Nt("add",t)},onRemove:function(t){Nt("remove",t)},onDrop:function(t){var e;if(t.list.length===st.current.length&&lt.current<at.current.start&&(at.current.front+=(null===(e=f.clone)||void 0===e?void 0:e[vt])||0,lt.current=null,rt((function(){return at.current}))),t.changed){var n=st.current;st.current=a(t.list),Ct(),Q((function(){return null})),nt((function(){return a(t.list)})),Dt(n,st.current)}Nt("drop",t)}}))},Dt=function(t,e){var n=Object.assign({},at.current);e.length>t.length&&at.current.end===t.length-1&&Mt()&&(n.end++,n.start=Math.max(0,n.end-i)),pt.current.sizes.size&&pt.current.updateRange(n),rt((function(){return at.current}))},Ct=function(){ct.current=st.current.map((function(t){return b(t,s)})),pt.current.option("uniqueKeys",ct.current)},Mt=function(){return bt()+St()+1>=wt()},Nt=function(e,n){var o=t[B[e]];o&&o(n)},Rt=y((function(){ut.current=st.current.length,Nt("top")}),50),kt=y((function(){Nt("bottom")}),50),At=function(t,e){var n=pt.current.sizes.size;pt.current.onItemResized(t,e),0===n&&Dt(st.current,st.current)},jt=function(t,e){pt.current.onSlotResized(t,e)},Bt=n.default.useCallback((function(t){return t==(null==J?void 0:J.dataset.key)?{display:"none"}:{}}),[J]),Pt=n.default.useMemo((function(){var t;return Object.assign(Object.assign({},Y),{overflow:(null===(t=pt.current)||void 0===t?void 0:t.useWindowScroll)?"":gt?"auto hidden":"hidden auto"})}),[Y,gt]),Ft=n.default.useMemo((function(){var t=it.front,e=it.behind;return Object.assign(Object.assign({},G),{padding:gt?"0px ".concat(e,"px 0px ").concat(t,"px"):"".concat(t,"px 0px ").concat(e,"px")})}),[G,gt,it]),Kt=function(e,o){return n.default.createElement(g,{key:o,Tag:e,dataKey:o,sizeKey:vt,children:t[o],className:t["".concat(o,"Class")],style:t["".concat(o,"Style")],onSizeChange:jt})};return n.default.createElement(k,{ref:ht,style:Pt,className:t.className},Kt(K,"header"),n.default.createElement(N,{ref:dt,style:Ft,className:t.wrapClass},et.slice(it.start,it.end+1).map((function(e,o){var i=it.start+o,r=b(e,s);return n.default.createElement(m,{key:r,Tag:P,index:i,record:e,dataKey:r,sizeKey:vt,children:t.children,className:t.itemClass,style:Object.assign(Object.assign({},U),Bt(r)),onSizeChange:At})}))),Kt(X,"footer"))}return n.default.forwardRef(P)}));
+!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e(require("react")):"function"==typeof define&&define.amd?define(["react"],e):(t="undefined"!=typeof globalThis?globalThis:t||self).VirtualDragList=e(t.React)}(this,(function(t){"use strict";function e(t){return t&&"object"==typeof t&&"default"in t?t:{default:t}}var n=e(t);function i(t,e){var n=Object.keys(t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(t);e&&(i=i.filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),n.push.apply(n,i)}return n}function o(t){for(var e=1;e<arguments.length;e++){var n=null!=arguments[e]?arguments[e]:{};e%2?i(Object(n),!0).forEach((function(e){s(t,e,n[e])})):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(n)):i(Object(n)).forEach((function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(n,e))}))}return t}function r(t){return r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},r(t)}function s(t,e,n){return e in t?Object.defineProperty(t,e,{value:n,enumerable:!0,configurable:!0,writable:!0}):t[e]=n,t}function l(t,e){return function(t){if(Array.isArray(t))return t}(t)||function(t,e){var n=null==t?null:"undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(null==n)return;var i,o,r=[],s=!0,l=!1;try{for(n=n.call(t);!(s=(i=n.next()).done)&&(r.push(i.value),!e||r.length!==e);s=!0);}catch(t){l=!0,o=t}finally{try{s||null==n.return||n.return()}finally{if(l)throw o}}return r}(t,e)||c(t,e)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function a(t){return function(t){if(Array.isArray(t))return u(t)}(t)||function(t){if("undefined"!=typeof Symbol&&null!=t[Symbol.iterator]||null!=t["@@iterator"])return Array.from(t)}(t)||c(t)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function c(t,e){if(t){if("string"==typeof t)return u(t,e);var n=Object.prototype.toString.call(t).slice(8,-1);return"Object"===n&&t.constructor&&(n=t.constructor.name),"Map"===n||"Set"===n?Array.from(t):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?u(t,e):void 0}}function u(t,e){(null==e||e>t.length)&&(e=t.length);for(var n=0,i=new Array(e);n<e;n++)i[n]=t[n];return i}"undefined"!=typeof globalThis?globalThis:"undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self&&self;function h(t){return t&&t.__esModule&&Object.prototype.hasOwnProperty.call(t,"default")?t.default:t}var d={exports:{}};
+/*!
+   * sortable-dnd v0.6.6
+   * open source under the MIT license
+   * https://github.com/mfuu/sortable-dnd#readme
+   */!function(t,e){t.exports=function(){function t(e){return(t="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t})(e)}function e(){return e=Object.assign?Object.assign.bind():function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t},e.apply(this,arguments)}var n={capture:!1,passive:!1},i=/\s+/g;function o(t){if("undefined"!=typeof window&&window.navigator)return!!navigator.userAgent.match(t)}var r=o(/(?:Trident.*rv[ :]?11\.|msie|iemobile|Windows Phone)/i),s=o(/Edge/i),l=o(/safari/i)&&!o(/chrome/i)&&!o(/android/i),a=function(){var t=!1;return document.addEventListener("checkIfSupportPassive",null,{get passive(){return t=!0,!0}}),t}(),c=function(){if("undefined"==typeof window||"undefined"==typeof document)return{};var t=window.getComputedStyle(document.documentElement,"")||["-moz-hidden-iframe"],e=(Array.prototype.slice.call(t).join("").match(/-(moz|webkit|ms)-/)||""===t.OLink&&["","o"])[1];return{dom:"WebKit|Moz|MS|O".match(new RegExp("("+e+")","i"))[1],lowercase:e,css:"-"+e+"-",js:e[0].toUpperCase()+e.substr(1)}}();function u(t,e){t.style["".concat(c.css,"transition-duration")]=e?"".concat(e,"ms"):""}function h(t,e){t.style["".concat(c.css,"transform")]=e?"".concat(e):""}function d(t,e,i){window.addEventListener?t.addEventListener(e,i,!(!a&&r)&&n):window.attachEvent?t.attachEvent("on"+e,i):t["on"+e]=i}function f(t,e,i){window.removeEventListener?t.removeEventListener(e,i,!(!a&&r)&&n):window.detachEvent?t.detachEvent("on"+e,i):t["on"+e]=null}function p(){return document.scrollingElement||document.documentElement}function m(t,e,n){if(t.getBoundingClientRect||t===window){var i,o,r,s,l,a,c;if(t!==window&&t.parentNode&&t!==p()?(o=(i=t.getBoundingClientRect()).top,r=i.left,s=i.bottom,l=i.right,a=i.height,c=i.width):(o=0,r=0,s=window.innerHeight,l=window.innerWidth,a=window.innerHeight,c=window.innerWidth),e&&t!==window){n=n||t.parentNode;do{if(n&&n.getBoundingClientRect){var u=n.getBoundingClientRect();o-=u.top+parseInt(O(n,"border-top-width")),r-=u.left+parseInt(O(n,"border-left-width")),s=o+i.height,l=r+i.width;break}}while(n=n.parentNode)}return{top:o,left:r,bottom:s,right:l,width:c,height:a}}}function g(t,e,n,i){if(!t)return null;if(n&&!e){var o=Array.prototype.slice.call(n.children),r=o.indexOf(t);if(r>-1)return o[r];for(var s=0;s<o.length;s++)if(v(t,o[s]))return o[s]}n=n||document;do{if(null!=e&&(">"===e[0]?t.parentNode===n&&E(t,e):E(t,e))||i&&t===n)return t;if(t===n)break}while(t=t.parentNode);return null}function v(t,e){if(!t||!e)return!1;if(e.compareDocumentPosition)return!!(16&e.compareDocumentPosition(t));if(e.contains&&1===t.nodeType)return e.contains(t)&&e!==t;for(;t=t.parentNode;)if(t===e)return!0;return!1}function y(t,e){for(var n=t.lastElementChild;n&&(n===it.ghost||"none"===O(n,"display")||e&&!E(n,e));)n=n.previousElementSibling;return n||null}function b(t,e){if(!t||!t.parentNode)return-1;for(var n=0;t=t.previousElementSibling;)"TEMPLATE"===t.nodeName.toUpperCase()||e&&!E(t,e)||"none"===O(t,"display")||n++;return n}function S(t,e,n,i){for(var o=0,r=0,s=t.children;o<s.length;){if(s[o]!==it.ghost&&"none"!==O(s[o],"display")&&g(s[o],n,t,!1)&&(i||s[o]!==it.dragged)){if(r===e)return s[o];r++}o++}return null}function w(t,e){var n=O(t),i=parseInt(n.width)-parseInt(n.paddingLeft)-parseInt(n.paddingRight)-parseInt(n.borderLeftWidth)-parseInt(n.borderRightWidth),o=S(t,0,e),l=S(t,1,e),a=o&&O(o),c=l&&O(l),u=a&&parseInt(a.marginLeft)+parseInt(a.marginRight)+m(o).width,h=c&&parseInt(c.marginLeft)+parseInt(c.marginRight)+m(l).width,d=s||r?"cssFloat":"float";if("flex"===n.display)return"column"===n.flexDirection||"column-reverse"===n.flexDirection?"vertical":"horizontal";if("grid"===n.display)return n.gridTemplateColumns.split(" ").length<=1?"vertical":"horizontal";if(o&&a.float&&"none"!==a.float){var f="left"===a.float?"left":"right";return!l||"both"!==c.clear&&c.clear!==f?"horizontal":"vertical"}return o&&("block"===a.display||"flex"===a.display||"table"===a.display||"grid"===a.display||u>=i&&"none"===n[d]||l&&"none"===n[d]&&u+h>i)?"vertical":"horizontal"}function x(t,e,n){if(t&&e)if(t.classList)t.classList[n?"add":"remove"](e);else{var o=(" "+t.className+" ").replace(i," ").replace(" "+e+" "," ");t.className=(o+(n?" "+e:"")).replace(i," ")}}function E(t,e){if(e){if(">"===e[0]&&(e=e.substring(1)),t)try{if(t.matches)return t.matches(e);if(t.msMatchesSelector)return t.msMatchesSelector(e);if(t.webkitMatchesSelector)return t.webkitMatchesSelector(e)}catch(t){return!1}return!1}}function O(t,e,n){var i=t&&t.style;if(i){if(void 0===n)return document.defaultView&&document.defaultView.getComputedStyle?n=document.defaultView.getComputedStyle(t,""):t.currentStyle&&(n=t.currentStyle),void 0===e?n:n[e];e in i||-1!==e.indexOf("webkit")||(e="-webkit-"+e),i[e]=n+("string"==typeof n?"":"px")}}function T(t,e){var n,i,o=(i=e,(n=t).compareDocumentPosition?n.compareDocumentPosition(i):n.contains?(n!=i&&n.contains(i)&&16)+(n!=i&&i.contains(n)&&8)+(n.sourceIndex>=0&&i.sourceIndex>=0?(n.sourceIndex<i.sourceIndex&&4)+(n.sourceIndex>i.sourceIndex&&2):1):0);return 2===o?1:4===o?-1:0}function I(t){void 0!==t.preventDefault&&t.cancelable&&t.preventDefault()}function D(t){var n=t.sortable,i=t.name,o=t.params,r=n.options[i];"function"==typeof r&&r(e({},o))}var _,z,C="Sortable"+Date.now();function M(t){this.options=t,this.autoScrollAnimationFrame=null}function k(t){this.options=t,this.animations=[]}function N(t){this.options=t||{},this.selectedElements=[]}window.requestAnimationFrame||(window.requestAnimationFrame=function(t){return setTimeout(t,17)}),window.cancelAnimationFrame||(window.cancelAnimationFrame=function(t){clearTimeout(t)}),M.prototype={destroy:function(){this.autoScrollAnimationFrame&&(cancelAnimationFrame(this.autoScrollAnimationFrame),this.autoScrollAnimationFrame=null)},update:function(t,e,n){var i=this;cancelAnimationFrame(this.autoScrollAnimationFrame),this.autoScrollAnimationFrame=requestAnimationFrame((function(){e&&n&&i.autoScroll(t,n),i.update(t,e,n)}))},autoScroll:function(t,e){if(t&&void 0!==e.clientX&&void 0!==e.clientY){var n=m(t);if(n){var i=e.clientX,o=e.clientY,r=n.top,s=n.right,l=n.bottom,a=n.left,c=n.height,u=n.width;if(!(o<r||i>s||o>l||i<a)){var h=this.options,d=h.scrollThreshold,f=h.scrollSpeed,p=t.scrollTop,g=t.scrollLeft,v=t.scrollHeight,y=p>0&&o>=r&&o<=r+d,b=g+u<t.scrollWidth&&i<=s&&i>=s-d,S=p+c<v&&o<=l&&o>=l-d,w=0,x=0;g>0&&i>=a&&i<=a+d&&(w=Math.floor(Math.max(-1,(i-a)/d-1)*f.x)),b&&(w=Math.ceil(Math.min(1,(i-s)/d+1)*f.x)),y&&(x=Math.floor(Math.max(-1,(o-r)/d-1)*f.y)),S&&(x=Math.ceil(Math.min(1,(o-l)/d+1)*f.y)),t.scrollTop+=x,t.scrollLeft+=w}}}}},k.prototype={collect:function(t){if(t){for(var e=m(t),n=window.innerWidth||document.documentElement.clientWidth||document.body.clientWidth,i=window.innerHeight||document.documentElement.clientHeight||document.body.clientHeight,o=Math.min(e.right,n),r=Math.min(e.bottom,i),s=Array.prototype.slice.call(t.children),l=[],a=0;a<=s.length;a++){var c=s[a];if(c&&c!==it.ghost&&"none"!==O(c,"display")){var u=m(c);if(!(u.bottom<0||u.right<0)){if(u.top-u.height>r||u.left-u.width>o)break;l.push({node:c,rect:u})}}}this.animations.push(l)}},animate:function(){for(var t=this.animations.pop(),e=0,n=t.length;e<n;e++){var i=t[e],o=i.node,r=i.rect;this._excute(o,r)}},_excute:function(t,e){var n=e.left,i=e.top,o=m(t);if(o.top!==i||o.left!==n){var r=i-o.top,s=n-o.left;u(t),h(t,"translate3d(".concat(s,"px, ").concat(r,"px, 0)")),t.offsetWidth,u(t,this.options.animation),h(t,"translate3d(0px, 0px, 0px)"),clearTimeout(t.animated),t.animated=setTimeout((function(){u(t),h(t,""),t.animated=null}),this.options.animation)}}},N.prototype={destroy:function(){_=z=null},active:function(){return!!_},setParams:function(t){t.nodes=_||[],t.clones=z||[]},select:function(t){x(t,this.options.selectedClass,!0),this.selectedElements.push(t),this.selectedElements.sort((function(t,e){return T(t,e)}))},deselect:function(t){var e=this.selectedElements.indexOf(t);e>-1&&(x(t,this.options.selectedClass,!1),this.selectedElements.splice(e,1))},getGhostElement:function(){if(!_)return null;var t=document.createElement("div");return this.selectedElements.forEach((function(e,n){var i=e.cloneNode(!0),o=0===n?1:.5;i.style="position: absolute;left: 0;top: 0;bottom: 0;right: 0;opacity: ".concat(o,";z-index: ").concat(n,";"),t.appendChild(i)})),t},toggleSelected:function(t,e){var n=this;e?t.forEach((function(t){return n.selectedElements.push(t)})):this.selectedElements=this.selectedElements.filter((function(e){return t.indexOf(e)<0}))},toggleClass:function(t){if(_)for(var e=0;e<_.length;e++)x(_[e],this.options.chosenClass,t)},toggleVisible:function(t){if(_)if(t){var e=_.indexOf(it.dragged);this._viewElements(_,e,it.dragged)}else this._hideElements(_)},onChoose:function(){!this.options.multiple||!this.selectedElements.length||this.selectedElements.indexOf(it.dragged)<0||(this.selectedElements.sort((function(t,e){return T(t,e)})),_=this.selectedElements,this.toggleClass(!0))},onDrag:function(t){_&&(t.animator.collect(it.dragged.parentNode),this._hideElements(_),t.animator.animate(),this.toggleClass(!1))},onDrop:function(t,e,n){if(_){var i=it.dragged,o=it.clone,r=_.indexOf(i);e[C].animator.collect(o.parentNode),t!==e&&"clone"===n?(O(o,"display","none"),z=_.map((function(t){return t.cloneNode(!0)})),this._viewElements(z,r,o),this._viewElements(_,r,i)):this._viewElements(_,r,o),e[C].animator.animate(),t!==e&&(e[C].multiplayer.toggleSelected(z||_,!0),"clone"!==n&&t[C].multiplayer.toggleSelected(_,!1))}},onSelect:function(t,e,n){var i=this.selectedElements.indexOf(e);x(e,this.options.selectedClass,i<0);var o={from:n.el,event:t,node:e,index:b(e)};i<0?(this.selectedElements.push(e),D({sortable:n,name:"onSelect",params:o})):(this.selectedElements.splice(i,1),D({sortable:n,name:"onDeselect",params:o})),this.selectedElements.sort((function(t,e){return T(t,e)}))},_viewElements:function(t,e,n){for(var i=0;i<t.length;i++)if(O(t[i],"display",""),i<e)n.parentNode.insertBefore(t[i],n);else{var o=i>0?t[i-1]:n;n.parentNode.insertBefore(t[i],o.nextSibling)}},_hideElements:function(t){for(var e=0;e<t.length;e++)t[e]!=it.dragged&&O(t[e],"display","none")}};var R,A,j,B,F,P,L,H,K,X,Y,W,U,q,G,V,Z,$,J,Q,tt,et=[],nt=function(e){var n={},i=e.group;i&&"object"==t(i)||(i={name:i,pull:!0,put:!0,revertDrag:!0}),n.name=i.name,n.pull=i.pull,n.put=i.put,n.revertDrag=i.revertDrag,e.group=n};function it(t,n){if(!t||!t.nodeType||1!==t.nodeType)throw"Sortable-dnd: `el` must be an HTMLElement, not ".concat({}.toString.call(t));t[C]=this,this.el=t,this.options=n=e({},n);var i={store:null,disabled:!1,group:"",lockAxis:"",animation:150,draggable:null,handle:null,multiple:!1,selectHandle:null,customGhost:null,direction:"",autoScroll:!0,scrollThreshold:55,scrollSpeed:{x:10,y:10},delay:0,delayOnTouchOnly:!1,touchStartThreshold:(Number.parseInt?Number:window).parseInt(window.devicePixelRatio,10)||1,ghostClass:"",ghostStyle:{},chosenClass:"",selectedClass:"",swapOnDrop:!0,fallbackOnBody:!1,supportTouch:"ontouchstart"in window,emptyInsertThreshold:-5};for(var o in i)!(o in this.options)&&(this.options[o]=i[o]);for(var r in nt(n),this)"_"===r.charAt(0)&&"function"==typeof this[r]&&(this[r]=this[r].bind(this));d(t,this.options.supportTouch?"touchstart":"mousedown",this._onDrag),et.push(t),this.autoScroller=new M(this.options),this.multiplayer=new N(this.options),this.animator=new k(this.options)}return it.prototype={constructor:it,_onDrag:function(t){var e=this;if(!A&&!this.options.disabled&&this.options.group.pull&&(!/mousedown|pointerdown/.test(t.type)||0===t.button)){var n=t.touches&&t.touches[0],i=(n||t).target;if(!l||!i||"SELECT"!==i.tagName.toUpperCase()){var o=g(i,this.options.draggable,this.el);if(o&&!o.animated){H={original:t,clientX:(n||t).clientX,clientY:(n||t).clientY},A=o,d(Y=n?A:document,"mouseup",this._onDrop),d(Y,"touchend",this._onDrop),d(Y,"touchcancel",this._onDrop);var a=this.options,c=a.handle,u=a.selectHandle;if("function"==typeof u&&u(t)||"string"==typeof u&&E(i,u))q=!0;else if(("function"!=typeof c||c(t))&&("string"!=typeof c||E(i,c))){var h=this.options,f=h.delay,p=h.delayOnTouchOnly;!f||p&&!n||s||r?this._onStart(n,t):(d(this.el.ownerDocument,"touchmove",this._delayMoveHandler),d(this.el.ownerDocument,"mousemove",this._delayMoveHandler),d(this.el.ownerDocument,"mouseup",this._cancelStart),d(this.el.ownerDocument,"touchend",this._cancelStart),d(this.el.ownerDocument,"touchcancel",this._cancelStart),U=setTimeout((function(){return e._onStart(n,t)}),f)),d(document,"selectstart",I),l&&O(document.body,"user-select","none")}}}}},_delayMoveHandler:function(t){var e=t.touches?t.touches[0]:t;Math.max(Math.abs(e.clientX-H.clientX),Math.abs(e.clientY-H.clientY))>=Math.floor(this.options.touchStartThreshold/(window.devicePixelRatio||1))&&this._cancelStart()},_cancelStart:function(){clearTimeout(U),f(this.el.ownerDocument,"touchmove",this._delayMoveHandler),f(this.el.ownerDocument,"mousemove",this._delayMoveHandler),f(this.el.ownerDocument,"mouseup",this._cancelStart),f(this.el.ownerDocument,"touchend",this._cancelStart),f(this.el.ownerDocument,"touchcancel",this._cancelStart),f(document,"selectstart",I),l&&O(document.body,"user-select","")},_onStart:function(t,e){var n=b(A);G=this.el,V=this.el,$=n,J=n,Q=n,tt=A,R=this.el,F=A.cloneNode(!0),L=A.parentNode,Z=this.options.group.pull,it.clone=F,it.active=this,it.dragged=A,x(A,this.options.chosenClass,!0),this.multiplayer.onChoose(),D({sortable:this,name:"onChoose",params:this._getParams(e)}),d(Y,t?"touchmove":"mousemove",this._nearestSortable);try{document.selection?setTimeout((function(){return document.selection.empty()}),0):window.getSelection().removeAllRanges()}catch(t){}},_onStarted:function(){x(F,this.options.chosenClass,!0),this._appendGhost(),this.multiplayer.onDrag(this),D({sortable:this,name:"onDrag",params:this._getParams(H.original)}),O(A,"display","none"),x(A,this.options.chosenClass,!1),A.parentNode.insertBefore(F,A)},_getGhostElement:function(){var t=this.options.customGhost;if("function"==typeof t){var e=this.multiplayer.selectedElements;return t(e.length?e:[A])}return this.multiplayer.getGhostElement()||A},_appendGhost:function(){if(!P){var t=this.options.fallbackOnBody?document.body:this.el,n=this._getGhostElement();x(P=n.cloneNode(!0),this.options.ghostClass,!0);var i,o=m(A),r=e({position:"fixed",top:o.top,left:o.left,width:o.width,height:o.height,minWidth:o.width,minHeight:o.height,opacity:"0.8",overflow:"hidden","z-index":"100000","box-sizing":"border-box","pointer-events":"none"},this.options.ghostStyle);for(var s in r)O(P,s,r[s]);i="none",P.style["".concat(c.css,"transition")]=i?"none"===i?"none":"".concat(i):"",h(P,"translate3d(0px, 0px, 0px)"),it.ghost=P,t.appendChild(P);var l=(H.clientX-o.left)/parseInt(P.style.width)*100,a=(H.clientY-o.top)/parseInt(P.style.height)*100;O(P,"transform-origin","".concat(l,"% ").concat(a,"%")),O(P,"transform","translateZ(0)"),O(P,"will-change","transform")}},_nearestSortable:function(t){I(t);var e=t.touches&&t.touches[0]||t;if(A&&function(t){var e=K||H;return!(void 0!==t.clientX&&void 0!==t.clientY&&Math.abs(t.clientX-e.clientX)<=0&&Math.abs(t.clientY-e.clientY)<=0)}(e)){!K&&this._onStarted();var n=this.options.lockAxis,i="x"===n?H.clientX:e.clientX,o="y"===n?H.clientY:e.clientY,r=document.elementFromPoint(i,o),s=i-H.clientX,l=o-H.clientY;if(K={original:t,clientX:i,clientY:o},h(P,"translate3d(".concat(s,"px, ").concat(l,"px, 0)")),this.options.autoScroll){var a=function(t,e){if(!t||!t.getBoundingClientRect)return p();var n=t,i=!1;do{if(n.clientWidth<n.scrollWidth||n.clientHeight<n.scrollHeight){var o=O(n);if(n.clientWidth<n.scrollWidth&&("auto"==o.overflowX||"scroll"==o.overflowX)||n.clientHeight<n.scrollHeight&&("auto"==o.overflowY||"scroll"==o.overflowY)){if(!n.getBoundingClientRect||n===document.body)return p();if(i||e)return n;i=!0}}}while(n=n.parentNode);return p()}(r,!0);this.autoScroller.update(a,H,K)}var c,u,d,f=(c=i,u=o,et.some((function(t){var e=t[C].options.emptyInsertThreshold;if(null!=e){var n=m(t),i=c>=n.left-e&&c<=n.right+e,o=u>=n.top-e&&u<=n.bottom+e;return i&&o?d=t:void 0}})),d);f&&f[C]._onMove(t,r)}},_allowPut:function(){if(R===this.el)return!0;if(this.options.group.put){var t=this.options.group,e=t.name,n=t.put,i=R[C].options.group;return n.join&&n.indexOf(i.name)>-1||i.name&&e&&i.name===e}return!1},_getDirection:function(){var t=this.options,e=t.draggable,n=t.direction;return n?"function"==typeof n?n.call(K.original,A,this):n:w(L,e)},_allowSwap:function(){var t=m(j),e="vertical"===this._getDirection(),n=e?"top":"left",i=e?"bottom":"right",o=j[e?"offsetHeight":"offsetWidth"],r=e?K.clientY:K.clientX,s=r>=t[n]&&r<t[i]-o/2?-1:1,l=S(L,0,this.options.draggable),a=y(L),c=m(l),u=m(a);if(j===L||v(L,j))return F===l&&r<c[n]?(B=j,!0):F===a&&r>u[i]&&(B=j.nextSibling,!0);var h=T(F,j);return B=h<0?j.nextSibling:j,X!==j?(W=s,!0):W!==s&&(W=s,s<0?h>0:h<0)},_onMove:function(t,e){if(this._allowPut()){if(D({sortable:this,name:"onMove",params:this._getParams(t)}),this.el!==V&&(e===this.el||!y(this.el)))return j=X=null,void this._onInsert(t);(j=g(e,this.options.draggable,this.el))&&!j.animated&&this._allowSwap()&&(j!==F&&B!==F?(this.el!==V?this._onInsert(t):j!==A&&this._onChange(t),X=j):X=j)}},_onInsert:function(t){var e=j||F,n="clone"===Z&&this.el!==R&&V===R,i="clone"===Z&&this.el===R&&V!==R;G=this.el,$=b(F),tt=e,L=j?j.parentNode:this.el,V[C].animator.collect(F.parentNode),this.animator.collect(L),n&&(O(A,"display",""),R[C].multiplayer.toggleVisible(!0),R[C].options.group.revertDrag||V.insertBefore(A,F)),i&&($=b(A),O(A,"display","none"),this.multiplayer.toggleVisible(!1)),j?L.insertBefore(F,W<0?j:j.nextSibling):L.appendChild(F),J=b(F),n&&R[C].options.group.revertDrag&&D({sortable:R[C],name:"onChange",params:this._getParams(t,{to:R,target:A,newIndex:Q,revertDrag:!0})}),n||D({sortable:V[C],name:"onRemove",params:this._getParams(t)}),i&&j!==A&&D({sortable:this,name:"onChange",params:this._getParams(t,{from:R,backToOrigin:!0})}),i||D({sortable:this,name:"onAdd",params:this._getParams(t)}),V[C].animator.animate(),this.animator.animate(),V=this.el},_onChange:function(t){L=j.parentNode,$=b(F),tt=j,this.animator.collect(L),L.insertBefore(F,B),J=b(F),D({sortable:this,name:"onChange",params:this._getParams(t)}),this.animator.animate(),V=this.el},_onDrop:function(t){I(t),this._cancelStart(),f(Y,"touchmove",this._nearestSortable),f(Y,"mousemove",this._nearestSortable),f(Y,"mouseup",this._onDrop),f(Y,"touchend",this._onDrop),f(Y,"touchcancel",this._onDrop),x(A,this.options.chosenClass,!1),R&&(V=R,$=Q,tt===F&&(tt=A),this.multiplayer.toggleClass(!1),D({sortable:this,name:"onUnchoose",params:this._getParams(t)}),K&&this._onEnd(t));var e=this.options,n=e.multiple,i=e.selectHandle;if(n&&(i&&q||!i&&!R)){var o=t.changedTouches?t.changedTouches[0]:t,r=o.clientX-H.clientX,s=o.clientY-H.clientY,l=Math.sqrt(r*r+s*s);l>=0&&l<=1&&this.multiplayer.onSelect(t,A,this)}P&&P.parentNode&&P.parentNode.removeChild(P),this.multiplayer.destroy(),this.autoScroller.destroy(),this._nulling()},_onEnd:function(t){var e=this._getParams(t);this.multiplayer.onDrop(V,G,Z);var n=this.options.swapOnDrop;"clone"===Z&&V!==G||!("function"==typeof n?n(e):n)||L.insertBefore(A,F),"clone"!==Z||V===G||this.multiplayer.active()?F&&F.parentNode&&F.parentNode.removeChild(F):x(F,this.options.chosenClass,!1),O(A,"display",""),V!==G&&D({sortable:V[C],name:"onDrop",params:e}),D({sortable:G[C],name:"onDrop",params:e})},_getParams:function(t){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},i={};return i.event=t,i.to=G,i.from=V,i.node=A,i.clone=F,i.target=tt,i.oldIndex=$,i.newIndex=J,i.pullMode=Z,this.multiplayer.setParams(i),e(i,n),i.relative=i.target===A?0:T(i.target,F),i},_nulling:function(){G=V=R=A=j=B=F=P=L=Z=$=J=Q=H=K=tt=X=Y=W=U=q=it.clone=it.ghost=it.active=it.dragged=null},destroy:function(){this._cancelStart(),this._nulling(),f(this.el,"touchstart",this._onDrag),f(this.el,"mousedown",this._onDrag),et.splice(et.indexOf(this.el),1),this.el[C]=this.animator=this.multiplayer=this.autoScroller=null},option:function(t,e){if(void 0===e)return this.options[t];this.options[t]=e,this.animator.options[t]=e,this.multiplayer.options[t]=e,this.autoScroller.options[t]=e,"group"===t&&nt(this.options)},select:function(t){this.multiplayer.select(t)},deselect:function(t){this.multiplayer.deselect(t)},getSelectedElements:function(){return this.multiplayer.selectedElements}},it.utils={on:d,off:f,css:O,index:b,closest:g,getRect:m,toggleClass:x,detectDirection:w},it.get=function(t){return t[C]},it.create=function(t,e){return new it(t,e)},it}()}(d);var f=h(d.exports),p=n.default.memo((function(t){var e=t.dataKey,i=t.children,o=t.onSizeChange,s=t.sizeKey,l=n.default.useRef(null),a="function"==typeof i?i(l):i;return n.default.useLayoutEffect((function(){var t;return void 0!==("undefined"==typeof ResizeObserver?"undefined":r(ResizeObserver))&&(t=new ResizeObserver((function(){var t=l.current[s];o&&o(e,t)})),l.current&&t.observe(l.current)),function(){t&&(t.disconnect(),t=null)}}),[l]),n.default.cloneElement(a,{ref:l})})),m=n.default.memo((function(t){var e=t.Tag,i=void 0===e?"div":e,o=t.children;return n.default.createElement(p,{dataKey:t.dataKey,sizeKey:t.sizeKey,onSizeChange:t.onSizeChange},n.default.createElement(i,{className:t.className,style:t.style,"data-key":t.dataKey,"data-index":t.index},"function"==typeof o?o(t.record,t.index,t.dataKey):o))}));function g(t,e){var n=null,i=function(){for(var i=this,o=arguments.length,r=new Array(o),s=0;s<o;s++)r[s]=arguments[s];n||(e<=0?t.apply(this,r):n=setTimeout((function(){n=void 0,t.apply(i,r)}),e))};return i.cancel=function(){n&&(clearTimeout(n),n=null)},i}function v(t,e){var n=g(t,e),i=function(){n.cancel(),n.apply(this,arguments)};return i.cancel=function(){n.cancel()},i}function y(t,e){return(Array.isArray(e)?e:e.replace(/\[/g,".").replace(/\]/g,".").split(".")).reduce((function(t,e){return(t||{})[e]}),t)}var b,S,w,x,E=["delay","group","handle","lockAxis","disabled","draggable","animation","autoScroll","ghostClass","ghostStyle","chosenClass","fallbackOnBody","scrollThreshold","delayOnTouchOnly"];function O(t,e){this.el=t,this.options=e,this.list=[],this.store={},this.reRendered=!1,this.init()}O.prototype={constructor:O,destroy:function(){this.sortable&&this.sortable.destroy(),this.sortable=this.store=this.reRendered=null},option:function(t,e){"list"===t?this.list=a(e):this.sortable.option(t,e)},init:function(){var t=this,e=E.reduce((function(e,n){return e[n]=t.options[n],e}),{});this.sortable=new f(this.el,o(o({},e),{},{swapOnDrop:function(t){return t.from===t.to},onDrag:function(e){return t.onDrag(e)},onAdd:function(e){return t.onAdd(e)},onRemove:function(e){return t.onRemove(e)},onChange:function(e){return t.onChange(e)},onDrop:function(e){return t.onDrop(e)}})),this.list=a(this.options.list)},onDrag:function(t){var e=t.node.dataset.key,n=this.getIndex(this.list,e),i=this.list[n];this.store={item:i,key:e,start:{index:n,list:this.list},from:{index:n,list:this.list},to:{index:n,list:this.list}},this.sortable.option("store",this.store),this.dispatchEvent("onDrag",{item:i,key:e,index:n})},onRemove:function(t){var e=t.node.dataset.key,n=this.getIndex(this.list,e),i=this.list[n];this.list.splice(n,1),Object.assign(this.store,{key:e,item:i}),this.sortable.option("store",this.store),this.dispatchEvent("onRemove",{item:i,key:e,index:n})},onAdd:function(t){var e=t.from,n=t.target,i=t.relative,o=f.get(e).option("store"),r=o.key,s=o.item,l=this.getIndex(this.list,n.dataset.key);0===i?l=this.list.length:-1===i&&(l+=1),this.list.splice(l,0,s),Object.assign(this.store,{to:{index:l,list:this.list}}),this.sortable.option("store",this.store),this.dispatchEvent("onAdd",{item:s,key:r,index:l})},onChange:function(t){var e=f.get(t.from).option("store");if(t.revertDrag)return this.list=a(this.options.list),void Object.assign(this.store,{from:e.start});var n=t.node,i=t.target,o=t.relative,r=t.backToOrigin,s=this.getIndex(this.list,n.dataset.key),l=this.list[s],c=this.getIndex(this.list,i.dataset.key);r&&(1===o&&e.from.index<c&&(c-=1),-1===o&&e.from.index>c&&(c+=1)),this.list.splice(s,1),this.list.splice(c,0,l),Object.assign(this.store,{from:{index:c,list:this.list},to:{index:c,list:this.list}})},onDrop:function(t){var e,n,i=f.get(t.from).option("store"),o=i.start,r=i.item,s=i.key,l=f.get(t.to).option("store").to,a=t.from!==t.to||o.index!==l.index;(this.dispatchEvent("onDrop",{changed:a,list:this.list,item:r,key:s,from:o,to:l}),t.from===this.el&&this.reRendered)&&(null===(e=f.dragged)||void 0===e||e.remove());t.from!==t.to&&"clone"===t.pullMode&&(null===(n=f.clone)||void 0===n||n.remove());this.reRendered=!1},getIndex:function(t,e){for(var n=0;n<t.length;n++)if(y(t[n],this.options.dataKey)==e)return n;return-1},dispatchEvent:function(t,e){var n=this.options[t];n&&n(e)}};var T={INIT:"INIT",FIXED:"FIXED",DYNAMIC:"DYNAMIC"},I="FRONT",D="BEHIND",_="STATIONARY",z="horizontal",C="vertical",M=(s(b={},C,"top"),s(b,z,"left"),b),k=(s(S={},C,"scrollTop"),s(S,z,"scrollLeft"),S),N=(s(w={},C,"scrollHeight"),s(w,z,"scrollWidth"),w),R=(s(x={},C,"offsetHeight"),s(x,z,"offsetWidth"),x);function A(t){this.options=t;var e={size:0,keeps:0,buffer:0,wrapper:null,scroller:null,direction:"vertical",uniqueKeys:[],debounceTime:null,throttleTime:null};for(var n in e)!(n in this.options)&&(this.options[n]=e[n]);this.sizes=new Map,this.range={start:0,end:0,front:0,behind:0},this.offset=0,this.calcType=T.INIT,this.calcSize={average:0,total:0,fixed:0},this.scrollEl=this.getScrollElement(t.scroller),this.scrollDir="",this.updateOnScrollFunction(),this.addScrollEventListener(),this.checkIfUpdate(0,t.keeps-1)}A.prototype={constructor:A,isFront:function(){return this.scrollDir===I},isBehind:function(){return this.scrollDir===D},isFixed:function(){return this.calcType===T.FIXED},getSize:function(t){return this.sizes.get(t)||this.getItemSize()},getOffset:function(){return this.scrollEl[k[this.options.direction]]},getScrollSize:function(){return this.scrollEl[N[this.options.direction]]},getClientSize:function(){return this.scrollEl[R[this.options.direction]]},scrollToOffset:function(t){this.scrollEl[k[this.options.direction]]=t},scrollToIndex:function(t){if(t>=this.options.uniqueKeys.length-1)this.scrollToBottom();else{var e=this.getOffsetByIndex(t),n=this.getScrollStartOffset();this.scrollToOffset(e+n)}},scrollToBottom:function(){var t=this,e=this.getScrollSize();this.scrollToOffset(e),setTimeout((function(){var e=t.getClientSize(),n=t.getScrollSize();t.getOffset()+e+1<n&&t.scrollToBottom()}),5)},option:function(t,e){var n=this,i=this.options[t];this.options[t]=e,"uniqueKeys"===t&&this.sizes.forEach((function(t,i){e.includes(i)||n.sizes.delete(i)})),"scroller"===t&&(i&&f.utils.off(i,"scroll",this.onScroll),this.scrollEl=this.getScrollElement(e),this.addScrollEventListener())},updateRange:function(t){if(t)this.handleUpdate(t.start,t.end);else{var e=this.range.start;e=Math.max(e,0),this.handleUpdate(e,this.getEndByStart(e))}},onItemResized:function(t,e){this.sizes.set(t,e),this.calcType===T.INIT?(this.calcType=T.FIXED,this.calcSize.fixed=e):this.isFixed()&&this.calcSize.fixed!==e&&(this.calcType=T.DYNAMIC,this.calcSize.fixed=void 0),this.calcType!==T.FIXED&&(this.calcSize.total=a(this.sizes.values()).reduce((function(t,e){return t+e}),0),this.calcSize.average=Math.round(this.calcSize.total/this.sizes.size))},addScrollEventListener:function(){this.options.scroller&&f.utils.on(this.options.scroller,"scroll",this.onScroll)},removeScrollEventListener:function(){this.options.scroller&&f.utils.off(this.options.scroller,"scroll",this.onScroll)},updateOnScrollFunction:function(){var t=this,e=this.options,n=e.debounceTime,i=e.throttleTime;this.onScroll=n?v((function(){return t.handleScroll()}),n):i?g((function(){return t.handleScroll()}),i):function(){return t.handleScroll()}},handleScroll:function(){var t=this.getOffset(),e=this.getClientSize(),n=this.getScrollSize();t===this.offset?this.scrollDir=_:this.scrollDir=t<this.offset?I:D,this.offset=t;var i=this.isFront()&&t<=0,o=this.isBehind()&&e+t>=n;this.options.onScroll({top:i,bottom:o,offset:t,direction:this.scrollDir}),this.isFront()?this.handleScrollFront():this.isBehind()&&this.handleScrollBehind()},handleScrollFront:function(){var t=this.getScrollItems();if(!(t>this.range.start)){var e=Math.max(t-this.options.buffer,0);this.checkIfUpdate(e,this.getEndByStart(e))}},handleScrollBehind:function(){var t=this.getScrollItems();t<this.range.start+this.options.buffer||this.checkIfUpdate(t,this.getEndByStart(t))},getScrollItems:function(){var t=this.offset-this.getScrollStartOffset();if(t<=0)return 0;if(this.isFixed())return Math.floor(t/this.calcSize.fixed);for(var e=0,n=this.options.uniqueKeys.length,i=0,o=0;e<=n;){if(i=e+Math.floor((n-e)/2),(o=this.getOffsetByIndex(i))===t)return i;o<t?e=i+1:o>t&&(n=i-1)}return e>0?--e:0},checkIfUpdate:function(t,e){var n=this.options.keeps;this.options.uniqueKeys.length<=n?(t=0,e=this.getLastIndex()):e-t<n-1&&(t=e-n+1),this.range.start!==t&&this.handleUpdate(t,e)},handleUpdate:function(t,e){this.range.start=t,this.range.end=e,this.range.front=this.getFrontOffset(),this.range.behind=this.getBehindOffset(),this.options.onUpdate(o({},this.range))},getFrontOffset:function(){return this.isFixed()?this.calcSize.fixed*this.range.start:this.getOffsetByIndex(this.range.start)},getBehindOffset:function(){var t=this.range.end,e=this.getLastIndex();return this.isFixed()?(e-t)*this.calcSize.fixed:(e-t)*this.getItemSize()},getOffsetByIndex:function(t){if(!t)return 0;for(var e=0,n=0;n<t;n++){var i=this.sizes.get(this.options.uniqueKeys[n]);e+="number"==typeof i?i:this.getItemSize()}return e},getEndByStart:function(t){return Math.min(t+this.options.keeps-1,this.getLastIndex())},getLastIndex:function(){var t=this.options,e=t.uniqueKeys,n=t.keeps;return e.length>0?e.length-1:n-1},getItemSize:function(){return this.isFixed()?this.calcSize.fixed:this.calcSize.average||this.options.size},getScrollElement:function(t){return t instanceof Document&&9===t.nodeType||t instanceof Window?document.scrollingElement||document.documentElement||document.body:t},getScrollStartOffset:function(){var t=0,e=this.options,n=e.wrapper,i=e.scroller;if(n&&n){var o=f.utils.getRect(n,!0,i);t=this.offset+o[M[this.options.direction]]}return t}};var j="v-top",B="v-bottom",F="v-drag",P="v-drop",L="v-add",H="v-remove";function K(t,e){var i=t.keeps,o=void 0===i?30:i,r=t.dataKey,s=void 0===r?"":r,c=t.direction,u=void 0===c?"vertical":c,h=t.dataSource,d=void 0===h?[]:h,p=t.throttleTime,g=void 0===p?0:p,b=t.debounceTime,S=void 0===b?0:b,w=t.delay,x=void 0===w?0:w,E=t.animation,T=void 0===E?150:E,I=t.autoScroll,D=void 0===I||I,_=t.scrollThreshold,z=void 0===_?55:_,C=t.wrapTag,M=void 0===C?"div":C,k=t.rootTag,N=void 0===k?"div":k,R=t.itemTag,K=void 0===R?"div":R,X=t.style,Y=void 0===X?{}:X,W=t.itemStyle,U=void 0===W?{}:W,q=t.wrapStyle,G=void 0===q?{}:q,V=t.ghostStyle,Z=void 0===V?{}:V,$=l(n.default.useState(null),2),J=$[0],Q=$[1],tt=l(n.default.useState([]),2),et=tt[0],nt=tt[1],it=l(n.default.useState({}),2),ot=it[0],rt=it[1],st=n.default.useRef([]),lt=n.default.useRef({start:0,end:o-1,front:0,behind:0}),at=n.default.useRef([]),ct=n.default.useRef(null),ut=n.default.useRef(null),ht=n.default.useRef(null),dt=n.default.useRef(null),ft=n.default.useRef(null),pt=n.default.useMemo((function(){var t="vertical"!==u;return{isHorizontal:t,itemSizeKey:t?"offsetWidth":"offsetHeight"}}),[u]),mt=pt.isHorizontal,gt=pt.itemSizeKey,vt=function(t){return ft.current.getSize(t)},yt=function(){return ft.current.getOffset()},bt=function(){return ft.current.getClientSize()},St=function(){return ft.current.getScrollSize()},wt=function(t){ft.current.scrollToOffset(t)},xt=function(t){ft.current.scrollToIndex(t)},Et=function(t){var e=at.current.indexOf(t);e>-1&&ft.current.scrollToIndex(e)},Ot=function(){wt(0)},Tt=function(){ft.current.scrollToBottom()};n.default.useImperativeHandle(e,(function(){return{getSize:vt,getOffset:yt,getClientSize:bt,getScrollSize:St,scrollToTop:Ot,scrollToKey:Et,scrollToIndex:xt,scrollToOffset:wt,scrollToBottom:Tt}})),n.default.useLayoutEffect((function(){It()}),[]),n.default.useEffect((function(){return Dt(),ft.current.option("wrapper",ht.current),t.scroller||ft.current.option("scroller",ut.current),function(){var t,e;null===(t=ft.current)||void 0===t||t.removeScrollEventListener(),null===(e=dt.current)||void 0===e||e.destroy()}}),[]),n.default.useEffect((function(){var e;null===(e=dt.current)||void 0===e||e.option("disabled",t.disabled)}),[t.disabled]),n.default.useEffect((function(){var e,n=a(st.current);if(st.current=d,zt(),nt((function(){return _t(n,st.current),a(d)})),null===(e=dt.current)||void 0===e||e.option("list",d),ct.current&&t.keepOffset){var i=Math.abs(d.length-ct.current);xt(i),ct.current=null}}),[d]);var It=function(){ft.current=new A({size:t.size,keeps:o,buffer:Math.round(o/3),scroller:t.scroller,direction:u,uniqueKeys:at.current,debounceTime:S,throttleTime:g,onScroll:function(t){ct.current=null,st.current.length&&t.top?Mt():t.bottom&&kt()},onUpdate:function(t){f.dragged&&t.start!==lt.current.start&&(dt.current.reRendered=!0),lt.current=t,rt((function(){return t}))}})},Dt=function(){dt.current=new O(ht.current,Object.assign(Object.assign({},t),{list:st.current,delay:x,animation:T,autoScroll:D,ghostStyle:Z,scrollThreshold:z,onDrag:function(e){var n;null===(n=t[F])||void 0===n||n.call(t,e),Q((function(){return f.dragged}))},onAdd:function(e){var n;null===(n=t[L])||void 0===n||n.call(t,e)},onRemove:function(e){var n;null===(n=t[H])||void 0===n||n.call(t,e)},onDrop:function(e){var n;if(e.changed){var i=st.current;st.current=a(e.list),zt(),Q((function(){return null})),nt((function(){return a(e.list)})),_t(i,st.current)}null===(n=t[P])||void 0===n||n.call(t,e)}}))},_t=function(t,e){var n=Object.assign({},lt.current);e.length>t.length&&lt.current.end===t.length-1&&Ct()&&(n.end++,n.start=Math.max(0,n.end-o)),ft.current.updateRange(n)},zt=function(){at.current=st.current.map((function(t){return y(t,s)})),ft.current.option("uniqueKeys",at.current)},Ct=function(){return yt()+bt()+1>=St()},Mt=v((function(){var e;ct.current=st.current.length,null===(e=t[j])||void 0===e||e.call(t)}),50),kt=v((function(){var e;null===(e=t[B])||void 0===e||e.call(t)}),50),Nt=function(t,e){var n=ft.current.sizes.size;ft.current.onItemResized(t,e),0===n&&_t(st.current,st.current)},Rt=n.default.useCallback((function(t){return t==(null==J?void 0:J.dataset.key)?{display:"none"}:{}}),[J]),At=n.default.useMemo((function(){return Object.assign(Object.assign({},Y),{overflow:t.scroller?"":mt?"auto hidden":"hidden auto"})}),[Y,mt,t.scroller]),jt=n.default.useMemo((function(){var t=ot.front,e=ot.behind;return Object.assign(Object.assign({},G),{padding:mt?"0px ".concat(e,"px 0px ").concat(t,"px"):"".concat(t,"px 0px ").concat(e,"px")})}),[G,mt,ot]);return n.default.createElement(N,{ref:ut,style:At,className:t.className},t.header,n.default.createElement(M,{ref:ht,style:jt,className:t.wrapClass},et.slice(ot.start,ot.end+1).map((function(e,i){var o=ot.start+i,r=y(e,s);return n.default.createElement(m,{key:r,Tag:K,index:o,record:e,dataKey:r,sizeKey:gt,children:t.children,className:t.itemClass,style:Object.assign(Object.assign({},U),Rt(r)),onSizeChange:Nt})}))),t.footer)}return n.default.forwardRef(K)}));

package.json

 {
   "name": "react-virtual-drag-list",
-  "version": "2.6.1",
+  "version": "2.6.2",
   "description": "A virtual scrolling list component that can be sorted by dragging",
@@ -39,3 +39,3 @@ "main": "dist/virtual-drag-list.js",
   "dependencies": {
-    "sortable-dnd": "0.6.4"
+    "sortable-dnd": "0.6.6"
   },
@@ -42,0 +42,0 @@ "devDependencies": {

README.md

@@ -23,10 +23,11 @@ # react-virtual-drag-list
 
-  const handleToTop = () => {
-    // to top
+  const onTop = () => {
+    // scrolled to the top of list
   }
-  const handleToBottom = () => {
-    // to bottom
+  const onBottom = () => {
+    // scrolled to the bottom of list
   }
-  const handleDrop = (params) => {
+  const onDrop = (params) => {
     // dnd complete
+    setList(() => params.list);
   }
@@ -44,5 +45,5 @@
       footer={ <div className="loading">bottom loading...</div> }
-      v-top={ handleToTop }
-      v-bottom={ handleToBottom }
-      v-drop={ handleDrop }
+      v-top={ onTop }
+      v-bottom={ onBottom }
+      v-drop={ onDrop }
     >
@@ -87,4 +88,5 @@ {
 | `group`          | `Object/String` |            | -            | string: 'name' or object: `{ name: 'group', put: true/false, pull: true/false/'clone', revertDrag: true/false }` |
-| `scroller`       | `HTMLElement \| Window \| Document`| | - | Virtual list scrolling element |
-| `direction`      | `String`     |               | `vertical`   | `vertical/horizontal`, scroll direction  |
+| `scroller`       | `Document \| HTMLElement` |  | -            | Virtual list scrolling element |
+| `direction`      | `vertical \| horizontal` |   | `vertical`   | Scroll direction  |
+| `lockAxis`       | `x \| y`     |               | `-`          | Axis on which dragging will be locked |
 | `keepOffset`     | `Boolean`    |               | `false`      | When scrolling up to load data, keep the same offset as the previous scroll  |
@@ -115,8 +117,2 @@ | `debounceTime`   | `Number`     |               | `0`          | debounce time on scroll |
 | `itemClass`     | `String`     |               | `''`        | List item element class |
-| `headerTag`     | `String`     |               | `div`       | Label type for header slot element |
-| `headerStyle`   | `Object`     |               | `{}`        | header slot style |
-| `headerClass`   | `String`     |               | `''`        | header slot class |
-| `footerTag`     | `String`     |               | `div`       | Label type for footer slot element |
-| `footerStyle`   | `Object`     |               | `{}`        | footer slot style |
-| `footerClass`   | `String`     |               | `''`        | footer slot class |
 | `ghostStyle`    | `Object`     |               | `{}`        | The style of the mask element when dragging |
@@ -123,0 +119,0 @@ | `ghostClass`    | `String`     |               | `''`        | The class of the mask element when dragging |

types/index.d.ts

 import React from 'react';
 
-type RenderFunc<T> = (item: T, index: number, props: {
+declare type RenderFunc<T> = (item: T, index: number, props: {
     style?: React.CSSProperties;
@@ -37,3 +37,4 @@ }) => React.ReactNode;
     handle?: Function | string;
-    scroller?: HTMLElement | Window | Document;
+    lockAxis?: 'x' | 'y';
+    scroller?: HTMLElement | Document;
     direction?: 'vertical' | 'horizontal';
@@ -55,4 +56,2 @@ debounceTime?: number;
     itemTag?: string;
-    headerTag?: string;
-    footerTag?: string;
     itemStyle?: CSSStyleDeclaration;
@@ -62,6 +61,2 @@ itemClass?: string;
     wrapClass?: string;
-    headerStyle?: CSSStyleDeclaration;
-    headerClass?: string;
-    footerStyle?: CSSStyleDeclaration;
-    footerClass?: string;
     ghostStyle?: CSSStyleDeclaration;
@@ -68,0 +63,0 @@ ghostClass?: string;

No alert changes

Improved metrics

Lines of code

2036

increased by2.83%

Worsened metrics

Total package byte prevSize

122460

decreased by-0.38%

Number of lines in readme file

153

decreased by-2.55%

Dependency changes

• + Addedsortable-dnd@0.6.6(transitive)

• - Removedsortable-dnd@0.6.4(transitive)

• Updatedsortable-dnd@0.6.6