virtual-scroller - npm Package Compare versions

Comparing version 1.2.0 to 1.2.1

bundle/virtual-scroller-dom.js

@@ -1,2 +0,2 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e=e||self).VirtualScroller=t()}(this,function(){"use strict";function e(t){return(e="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(t)}var t=Object.prototype.hasOwnProperty;function n(e,t){return e===t?0!==e||0!==t||1/e==1/t:e!=e&&t!=t}function i(e){var t=e.getBoundingClientRect(),n=document.clientLeft||document.body.clientLeft||0,i=document.clientTop||document.body.clientTop||0,o=window.pageYOffset,s=window.pageXOffset;return{top:t.top+o-i,left:t.left+s-n,width:t.width,height:t.height}}function o(){return window.pageYOffset}function s(){return window.innerHeight}function r(){return window.innerWidth}function a(e){return function(e){if(Array.isArray(e)){for(var t=0,n=new Array(e.length);t<e.length;t++)n[t]=e[t];return n}}(e)||function(e){if(Symbol.iterator in Object(e)||"[object Arguments]"===Object.prototype.toString.call(e))return Array.from(e)}(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance")}()}function h(){if(u()){for(var e,t=arguments.length,n=new Array(t),i=0;i<t;i++)n[i]=arguments[i];(e=console).log.apply(e,a(["[virtual-scroller]"].concat(n)))}}function u(){return"undefined"!=typeof window&&window.VirtualScrollerDebug}function d(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}var m=function(){function e(t,n){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),this.getContainerNode=t,this.getState=n,this.reset()}var t,n,i;return t=e,(n=[{key:"reset",value:function(){this.measuredItemsHeight=0,this.firstMeasuredItemIndex=void 0,this.lastMeasuredItemIndex=void 0}},{key:"onInitItemHeights",value:function(){this.reset();for(var e=0;e<this.getState().itemHeights.length;){if(null==this.getState().itemHeights[e]){if(void 0!==this.firstMeasuredItemIndex){this.lastMeasuredItemIndex=e-1;break}}else void 0===this.firstMeasuredItemIndex&&(this.firstMeasuredItemIndex=e),this.measuredItemsHeight+=this.getState().itemHeights[e];e++}}},{key:"_getItemHeight",value:function(e,t){var n=this.getContainerNode();if(n){var i=e-t;if(i>=0&&i<n.childNodes.length)return n.childNodes[i].getBoundingClientRect().height}}},{key:"getItemSpacing",value:function(){var e=this.getContainerNode();if(e&&e.childNodes.length>1){var t=e.childNodes[0],n=e.childNodes[1],i=t.getBoundingClientRect(),o=n.getBoundingClientRect().top-(i.top+i.height);return window.VirtualScrollerDebug&&h("Item spacing",o),o}}},{key:"update",value:function(e,t,n){void 0===this.getState().itemSpacing&&(this.getState().itemSpacing=this.getItemSpacing()),void 0!==this.firstMeasuredItemIndex&&(e>this.lastMeasuredItemIndex+1||t<this.firstMeasuredItemIndex-1)&&this.reset();for(var i=this.firstMeasuredItemIndex,o=this.lastMeasuredItemIndex,s=!1,r=e;r<=t;){var a=this._getItemHeight(r,n);void 0!==a&&(this.set(r,a),(void 0===i||r<i)&&(this.measuredItemsHeight+=a,s||(this.firstMeasuredItemIndex=r,s=!0)),(void 0===o||r>o)&&(void 0!==o&&(this.measuredItemsHeight+=a),this.lastMeasuredItemIndex=r)),r++}}},{key:"updateItemHeight",value:function(e,t){var n=this.get(e),i=this._getItemHeight(e,t);void 0!==n&&void 0!==i&&(this.set(e,i),this.measuredItemsHeight+=i-n)}},{key:"getAverage",value:function(){return this.measuredItemsHeight?this.measuredItemsHeight/(this.lastMeasuredItemIndex-this.firstMeasuredItemIndex+1):0}},{key:"get",value:function(e){return this.getState().itemHeights[e]}},{key:"set",value:function(e,t){this.getState().itemHeights[e]=t}},{key:"onPrepend",value:function(e){void 0!==this.firstMeasuredItemIndex&&(this.firstMeasuredItemIndex+=e,this.lastMeasuredItemIndex+=e)}}])&&d(t.prototype,n),i&&d(t,i),e}();function l(e){return e.toFixed(2)+"px"}function c(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{},i=Object.keys(n);"function"==typeof Object.getOwnPropertySymbols&&(i=i.concat(Object.getOwnPropertySymbols(n).filter(function(e){return Object.getOwnPropertyDescriptor(n,e).enumerable}))),i.forEach(function(t){I(e,t,n[t])})}return e}function g(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}function I(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}var f=250,S=function(){function a(i,r){var d,l,g,S=this,v=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,a),I(this,"updateLayout",function(){return S.onUpdateShownItemIndexes({reason:"manual"})}),I(this,"onScroll",function(){return S.onUpdateShownItemIndexes({reason:"scroll"})}),I(this,"restoreScrollPosition",function(){var e=S.getState().scrollY;void 0!==e&&window.scrollTo(0,e)}),I(this,"updateScrollPosition",function(){return S.getState().scrollY=o()}),I(this,"layout",function(){return S.updateLayout()}),I(this,"onResize",(d=function(e){S.isMounted&&S.shouldUpdateLayoutOnWindowResize(e)&&(h("~ Window width changed, re-measure item heights. ~"),S.setState(S.getInitialLayoutState(),function(){S.onInitialRender("resize")}))},l=f,function(){clearTimeout(g),g=setTimeout(d,l)})),I(this,"updateShownItemIndexes",function(e){var t=S.getShownItemIndexes(),n=t.firstShownItemIndex,i=t.lastShownItemIndex,o=t.redoLayoutAfterRender,s=S.getBeforeItemsHeight(n,i),r=S.getAfterItemsHeight(n,i);S.updateWillBeHiddenItemHeightsAndState(n,i),h("~ Layout results "+(S.bypass?"(bypass) ":"")+"~"),h("First shown item index",n),h("Last shown item index",i),h("Before items height",s),h("After items height",r),h("Average item height (calculated on previous render)",S.itemHeights.getAverage()),u()&&(h("Item heights",S.getState().itemHeights.slice()),h("Item states",S.getState().itemStates.slice())),o&&h("Redo layout after render"),void 0!==S.firstSeenItemIndex&&(n>S.lastSeenItemIndex+1||i<S.firstSeenItemIndex-1)&&(S.firstSeenItemIndex=void 0,S.lastSeenItemIndex=void 0),S.onBeforeShowItems(n,i),S.setState({firstShownItemIndex:n,lastShownItemIndex:i,beforeItemsHeight:s,afterItemsHeight:r},function(){return e(o)})}),I(this,"updateShownItemIndexesRecursive",function(){S.updateShownItemIndexes(function(e){e?setTimeout(function(){S.isMounted?S.updateShownItemIndexesRecursive():S.onDoneUpdatingItemIndexes()},0):S.onDoneUpdatingItemIndexes()})}),I(this,"restoreScroll",function(){var e=S.restoreScrollAfterPrepend,t=e.index,n=e.screenTop;S.restoreScrollAfterPrepend=void 0;var i=S.getItemElement(t).getBoundingClientRect().top-n;0!==i&&(h("Restore scroll position: scroll by",i),window.scrollTo(0,o()+i))}),I(this,"onUpdateShownItemIndexes",function(e){var t=e.reason;e.force;if(0!==S.getItemsCount()&&!S.isUpdatingItemIndexes){if(clearTimeout(S.onUserStopsScrollingTimeout),"scroll"===t){var n=void 0!==S.latestLayoutScreenTopAfterMargin&&o()<S.latestLayoutScreenTopAfterMargin&&S.getState().firstShownItemIndex>0||void 0!==S.latestLayoutScreenBottomAfterMargin&&o()+s()>S.latestLayoutScreenBottomAfterMargin&&S.getState().lastShownItemIndex<S.getItemsCount()-1;if(h(n?"The user has scrolled far enough: force re-render":"The user hasn't scrolled too much: delay re-render"),!n)return S.onUserStopsScrollingTimeout=setTimeout(S.onUserStoppedScrolling,100)}h("~ Update layout (".concat(t,") ~")),S.isUpdatingItemIndexes=!0,S.updateShownItemIndexesRecursive()}}),I(this,"onUserStoppedScrolling",function(){S.isMounted&&S.updateLayout("stopped scrolling")});var p=v.getState,y=v.setState,w=v.onStateChange,x=v.customState,b=v.preserveScrollPositionAtBottomOnMount,H=v.shouldUpdateLayoutOnWindowResize,C=v.measureItemsBatchSize,k=v.bypass,O=v.estimatedItemHeight,A=v.onItemFirstRender,M=v.state;h("~ Initialize ~"),M&&(r=M.items),this.bypass=k,this.initialItems=r,this.estimatedItemHeight=O,this._shouldUpdateLayoutOnWindowResize=H,this.measureItemsBatchSize=void 0===C?50:C,A&&(this.onItemFirstRender=A),i()&&function(e){for(;e.firstChild;)e.removeChild(e.firstChild)}(i()),y?(this.getState=p,this.setState=y):(this.getState=function(){return S.state},this.setState=function(i,o){var s=S.state;S.state=c({},s,i),function(i,o){if(n(i,o))return!0;if("object"!==e(i)||null===i||"object"!==e(o)||null===o)return!1;var s=Object.keys(i),r=Object.keys(o);if(s.length!==r.length)return!1;for(var a=0;a<s.length;a++)if(!t.call(o,s[a])||!n(i[s[a]],o[s[a]]))return!1;return!0}(S.state,s)||(w&&w(S.state,s),S.isMounted&&S.onUpdate(s)),o&&o()}),M&&h("Initial state (passed)",M),this.getContainerNode=i,this.itemHeights=new m(i,this.getState),b&&(this.preserveScrollPositionAtBottomOnMount={documentHeight:document.documentElement.scrollHeight}),this.setState(M||this.getInitialState(x),function(){S.itemHeights.onInitItemHeights()}),h("Items count",r.length),O&&h("Estimated item height",O)}var d,l,S;return d=a,(l=[{key:"getInitialState",value:function(e){var t=this.initialItems.length,n=c({},e,this.getInitialLayoutState(),{items:this.initialItems,itemStates:new Array(t)});return h("Initial state (created)",n),h("First shown item index",n.firstShownItemIndex),h("Last shown item index",n.lastShownItemIndex),n}},{key:"getInitialLayoutState",value:function(){var e,t,n=this.initialItems.length;return n>0&&(e=0,t=this.getLastShownItemIndex(e,n)),this.preserveScrollPositionAtBottomOnMount&&(e=0,t=n-1),this.onBeforeShowItems(e,t),{itemHeights:new Array(n),itemSpacing:void 0,beforeItemsHeight:0,afterItemsHeight:0,firstShownItemIndex:e,lastShownItemIndex:t,scrollY:void 0}}},{key:"getEstimatedItemHeight",value:function(){return this.itemHeights&&this.itemHeights.getAverage()||this.estimatedItemHeight||0}},{key:"getItemSpacing",value:function(){return this.getState()&&this.getState().itemSpacing||0}},{key:"getEstimatedItemsCount",value:function(e){return this.getEstimatedItemHeight()?Math.ceil((e+this.getItemSpacing())/(this.getEstimatedItemHeight()+this.getItemSpacing())):1}},{key:"getEstimatedItemsCountOnScreen",value:function(){return"undefined"!=typeof window?this.getEstimatedItemsCount(window.innerHeight):1}},{key:"getLastShownItemIndex",value:function(e,t){return this.bypass?t-1:Math.min(e+(this.getEstimatedItemsCountOnScreen()-1),t-1)}},{key:"getItemsCount",value:function(){return this.getState().items.length}},{key:"getMargin",value:function(){return window.innerHeight}},{key:"onBeforeShowItems",value:function(e,t){if(this.onItemFirstRender)if(void 0===this.firstSeenItemIndex){for(var n=e;n<=t;)this.onItemFirstRender(n),n++;this.firstSeenItemIndex=e,this.lastSeenItemIndex=t}else{if(e<this.firstSeenItemIndex){for(var i=e,o=Math.min(t,this.firstSeenItemIndex-1),s=i;s<=o;)this.onItemFirstRender(s),s++;this.firstSeenItemIndex=e}if(t>this.lastSeenItemIndex){for(var r=t,a=Math.max(e,this.lastSeenItemIndex+1);a<=r;)this.onItemFirstRender(a),a++;this.lastSeenItemIndex=t}}}},{key:"onMount",value:function(){this.onInitialRender("mount"),this.isMounted=!0,this.screenWidth=r(),this.screenHeight=s(),this.restoreScrollPosition(),this.updateScrollPosition(),window.addEventListener("scroll",this.updateScrollPosition),this.bypass||(window.addEventListener("scroll",this.onScroll),window.addEventListener("resize",this.onResize))}},{key:"onInitialRender",value:function(e){var t=this.getState(),n=t.firstShownItemIndex,i=t.lastShownItemIndex;this.getItemsCount()>0&&this.updateItemHeights(n,i),this.preserveScrollPositionAtBottomOnMount?window.scrollTo(0,o()+(document.documentElement.scrollHeight-this.preserveScrollPositionAtBottomOnMount.documentHeight)):this.onUpdateShownItemIndexes({reason:e})}},{key:"shouldUpdateLayoutOnWindowResize",value:function(e){if(document.fullscreenElement&&this.getContainerNode().contains(document.fullscreenElement))return!1;if(this._shouldUpdateLayoutOnWindowResize&&!this._shouldUpdateLayoutOnWindowResize(e))return!1;var t=r(),n=s(),i=this.screenWidth,o=this.screenHeight;return this.screenWidth=t,this.screenHeight=n,t!==i||n!==o&&(this.onUpdateShownItemIndexes({reason:"resize"}),!1)}},{key:"onUnmount",value:function(){this.isMounted=!1,window.removeEventListener("scroll",this.updateScrollPosition),this.bypass||(window.removeEventListener("scroll",this.onScroll),window.removeEventListener("resize",this.onResize),clearTimeout(this.onUserStopsScrollingTimeout),clearTimeout(this.watchContainerElementTopCoordinateTimer))}},{key:"onUpdate",value:function(e){var t=this.getState(),n=t.items,i=t.firstShownItemIndex,o=t.lastShownItemIndex;i===e.firstShownItemIndex&&o===e.lastShownItemIndex&&n===e.items||this.updateItemHeights(i,o)}},{key:"updateItemHeights",value:function(e,t){var n=this.getState().firstShownItemIndex;void 0!==e&&(h("~ Measure item heights after layout ~"),this.itemHeights.update(e,t,n),u()&&h("Item heights",this.getState().itemHeights.slice()))}},{key:"updateItemHeight",value:function(e){var t=this.getState().firstShownItemIndex;this.itemHeights.updateItemHeight(e,t)}},{key:"onItemStateChange",value:function(e,t){u()&&(h("~ Item state changed ~"),h("Item",e),h("Previous state\n"+JSON.stringify(this.getState().itemStates[e],null,2)),h("New state\n"+JSON.stringify(t,null,2))),this.getState().itemStates[e]=t}},{key:"onItemHeightChange",value:function(e){var t=this.getState().itemHeights,n=t[e];this.updateItemHeight(e);var i=t[e];n!==i&&(h("~ Item height changed ~"),h("Item",e),h("Previous height",n),h("New height",i),this.onUpdateShownItemIndexes({reason:"item height change"}))}},{key:"getItemCoordinates",value:function(e){for(var t=i(this.getContainerNode()).top,n=0;n<e;)t+=this.getState().itemHeights[n],t+=this.getItemSpacing(),n++;return{top:t,bottom:t+this.getState().itemHeights[e],height:this.getState().itemHeights[n]}}},{key:"getVisibleItemIndexes",value:function(e,t,n){for(var i,o,s,r=0,a=!1,u=0;u<this.getItemsCount();){var d=this.itemHeights.get(u);if(void 0===d){h("Item ".concat(u," height hasn't been measured yet: render and redo layout")),s=u,void 0===i&&(i=u);var m=t-(n+r);o=Math.min(u+(this.getEstimatedItemsCount(m)-1),this.getItemsCount()-1),a=!0;break}if(r+=d,void 0===i&&n+r>e&&(h("First visible item index (including margin)",u),i=u),u<this.getItemsCount()-1&&(r+=this.getItemSpacing()),n+r>t){h("Last visible item index (including margin)",u),void 0!==i&&(o=u);break}u++}return void 0!==i&&void 0===o&&h("Last item index (is fully visible)",o=this.getItemsCount()-1),this.restoreScrollAfterPrepend&&(o<this.restoreScrollAfterPrepend.index&&(o=this.restoreScrollAfterPrepend.index),a=!1),a&&this.measureItemsBatchSize&&(o=Math.min(o,s+this.measureItemsBatchSize-1)),{firstShownItemIndex:i,lastShownItemIndex:o,redoLayoutAfterRender:a}}},{key:"getOffscreenListShownItemIndexes",value:function(){return{firstShownItemIndex:0,lastShownItemIndex:0,redoLayoutAfterRender:void 0===this.itemHeights.get(0)}}},{key:"getItemIndexes",value:function(e,t,n,i){if(!(i>e&&n<t))return this.getOffscreenListShownItemIndexes();var o=this.getVisibleItemIndexes(e,t,n);return void 0===o.firstShownItemIndex?this.getOffscreenListShownItemIndexes():o}},{key:"getBeforeItemsHeight",value:function(e,t){for(var n=0,i=0;i<e;)n+=this.itemHeights.get(i)||this.itemHeights.getAverage(),n+=this.getItemSpacing(),i++;return n}},{key:"getAfterItemsHeight",value:function(e,t){for(var n=0,i=t+1;i<this.getItemsCount();)n+=this.getItemSpacing(),n+=this.itemHeights.get(i)||this.itemHeights.getAverage(),i++;return n}},{key:"updateWillBeHiddenItemHeightsAndState",value:function(e,t){for(var n=this.getState().firstShownItemIndex;n<=this.getState().lastShownItemIndex;)n>=e&&n<=t||this.updateItemHeight(n),n++}},{key:"watchContainerElementTopCoordinate",value:function(){var e=this,t=Date.now();!function n(){e.isMounted&&(void 0!==e.top&&i(e.getContainerNode()).top!==e.top&&e.onUpdateShownItemIndexes({reason:"top offset change"}),Date.now()-t<3e3&&(e.watchContainerElementTopCoordinateTimer=setTimeout(n,500)))}()}},{key:"getShownItemIndexes",value:function(){if(this.bypass)return{firstShownItemIndex:0,lastShownItemIndex:this.getItemsCount()-1};var e=i(this.getContainerNode()),t=e.top,n=e.height;void 0===this.top&&this.watchContainerElementTopCoordinate(),this.top=t;var r=function(){var e=s();return{top:o(),bottom:o()+e,height:e}}(),a=r.top,h=r.bottom;return this.latestLayoutScreenTopAfterMargin=a-this.getMargin(),this.latestLayoutScreenBottomAfterMargin=h+this.getMargin(),this.getItemIndexes(a-this.getMargin(),h+this.getMargin(),t,t+n)}},{key:"onDoneUpdatingItemIndexes",value:function(){this.isUpdatingItemIndexes=!1,this.restoreScrollAfterPrepend&&this.restoreScroll()}},{key:"captureScroll",value:function(e,t,n){0!==e.length&&(void 0===n&&(n=t.indexOf(e[0])),n<0||0!==n&&(this.getState().firstShownItemIndex>0||this.restoreScrollAfterPrepend&&this.restoreScrollAfterPrepend.previousItems===e&&this.restoreScrollAfterPrepend.nextItems===t||(this.restoreScrollAfterPrepend={previousItems:e,nextItems:t,index:n,screenTop:this.getItemElement(0).getBoundingClientRect().top})))}},{key:"updateItems",value:function(e,t){return this.setItems(e,t)}},{key:"setItems",value:function(e){var t=this,n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},i=this.getState().items,o=this.getState(),s=o.firstShownItemIndex,r=o.lastShownItemIndex,a=o.beforeItemsHeight,u=o.afterItemsHeight,d=o.itemStates,m=o.itemHeights;o.itemSpacing;h("~ Update items ~");var l=function(e,t){var n=-1,i=-1;e.length>0&&(n=t.indexOf(e[0]))>=0&&function(e,t,n){var i=0;for(;i<e.length;){if(t.length<=n+i||t[n+i]!==e[i])return!1;i++}return!0}(e,t,n)&&(i=n+e.length-1);if(n>=0&&i>=0)return{prependedItemsCount:n,appendedItemsCount:t.length-(i+1)};return{prependedItemsCount:-1,appendedItemsCount:-1}}(i,e),g=l.prependedItemsCount,I=l.appendedItemsCount,f=g>0||I>0;f?(g>0&&(h("Prepended items count",g),m=new Array(g).concat(m),this.itemHeights.onPrepend(g),d&&(d=new Array(g).concat(d)),(n.preserveScrollPositionOnPrependItems||n.preserveScrollPosition)&&this.captureScroll(i,e,g)),I>0&&(h("Appended items count",I),m=m.concat(new Array(I)),d&&(d=d.concat(new Array(I)))),void 0!==this.firstSeenItemIndex&&(this.firstSeenItemIndex+=g,this.lastSeenItemIndex+=g),s+=g,r+=g,a+=this.itemHeights.getAverage()*g,u+=this.itemHeights.getAverage()*I):(h("Non-incremental items update"),h("Previous items",i),h("New items",e),m=new Array(e.length),d=new Array(e.length),this.firstSeenItemIndex=void 0,this.lastSeenItemIndex=void 0,0===e.length?(s=void 0,r=void 0):(s=0,r=this.getLastShownItemIndex(s,e.length)),a=0,u=0),h("First shown item index",s),h("Last shown item index",r),h("Before items height",a),h("After items height",u),this.onBeforeShowItems(s,r),this.setState(c({},void 0,{items:e,itemStates:d,itemHeights:m,firstShownItemIndex:s,lastShownItemIndex:r,beforeItemsHeight:a,afterItemsHeight:u}),function(){f||t.itemHeights.onInitItemHeights(),t.onUpdateShownItemIndexes({reason:"update items",force:!0})})}},{key:"getItemElement",value:function(e){return this.getContainerNode().childNodes[e]}}])&&g(d.prototype,l),S&&g(d,S),a}();function v(e,t){if(null==e)return{};var n,i,o=function(e,t){if(null==e)return{};var n,i,o={},s=Object.keys(e);for(i=0;i<s.length;i++)n=s[i],t.indexOf(n)>=0||(o[n]=e[n]);return o}(e,t);if(Object.getOwnPropertySymbols){var s=Object.getOwnPropertySymbols(e);for(i=0;i<s.length;i++)n=s[i],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}function p(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}function y(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}return function(){function e(t,n,i){var o=this,s=arguments.length>3&&void 0!==arguments[3]?arguments[3]:{};!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),y(this,"onStateChange",function(e,t){var n=e.items,i=e.firstShownItemIndex,s=e.lastShownItemIndex,r=e.beforeItemsHeight,a=e.afterItemsHeight;h("~ On state change ~"),h("Previous state",t),h("New state",e),o.container.style.paddingTop=l(r),o.container.style.paddingBottom=l(a);var u=t&&n===t.items&&t.items.length>0;if(u){h("Incremental render");for(var d=t.lastShownItemIndex;d>=t.firstShownItemIndex;)d>=i&&d<=s||(h("Remove item",d),o.unmountItem(o.container.childNodes[d-t.firstShownItemIndex])),d--}else for(h("Clean render");o.container.firstChild;)o.unmountItem(o.container.firstChild);for(var m=u,c=m&&o.container.firstChild,g=i;g<=s;){if(u&&g>=t.firstShownItemIndex&&g<=t.lastShownItemIndex)m&&(m=!1);else{var I=o.renderItem(n[g]);m?(h("Prepend item",g),o.container.insertBefore(I,c)):(h("Append item",g),o.container.appendChild(I))}g++}}),y(this,"onUnmount",function(){o.virtualScroller.onUnmount()}),this.container=t,this.renderItem=i;var r=s.onMount,a=s.onItemUnmount,u=v(s,["onMount","onItemUnmount"]);this.onItemUnmount=a,this.virtualScroller=new S(function(){return o.container},n,function(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{},i=Object.keys(n);"function"==typeof Object.getOwnPropertySymbols&&(i=i.concat(Object.getOwnPropertySymbols(n).filter(function(e){return Object.getOwnPropertyDescriptor(n,e).enumerable}))),i.forEach(function(t){y(e,t,n[t])})}return e}({},u,{onStateChange:this.onStateChange})),r&&r(),this.virtualScroller.onMount()}var t,n,i;return t=e,(n=[{key:"unmountItem",value:function(e){this.container.removeChild(e),this.onItemUnmount&&this.onItemUnmount(e)}},{key:"onItemHeightChange",value:function(e){this.virtualScroller.onItemHeightChange(e)}},{key:"updateItems",value:function(e,t){this.setItems(e,t)}},{key:"setItems",value:function(e,t){this.virtualScroller.setItems(e,t)}},{key:"getItemCoordinates",value:function(e){return this.virtualScroller.getItemCoordinates(e)}}])&&p(t.prototype,n),i&&p(t,i),e}()});
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e=e||self).VirtualScroller=t()}(this,function(){"use strict";function e(t){return(e="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(t)}var t=Object.prototype.hasOwnProperty;function n(e,t){return e===t?0!==e||0!==t||1/e==1/t:e!=e&&t!=t}function i(e){var t=e.getBoundingClientRect(),n=document.clientLeft||document.body.clientLeft||0,i=document.clientTop||document.body.clientTop||0,o=window.pageYOffset,r=window.pageXOffset;return{top:t.top+o-i,left:t.left+r-n,width:t.width,height:t.height}}function o(){return window.pageYOffset}function r(){return window.innerWidth}function s(){return window.innerHeight}function a(e){return function(e){if(Array.isArray(e)){for(var t=0,n=new Array(e.length);t<e.length;t++)n[t]=e[t];return n}}(e)||function(e){if(Symbol.iterator in Object(e)||"[object Arguments]"===Object.prototype.toString.call(e))return Array.from(e)}(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance")}()}function h(){if(d()){for(var e,t=arguments.length,n=new Array(t),i=0;i<t;i++)n[i]=arguments[i];(e=console).log.apply(e,a(["[virtual-scroller]"].concat(n)))}}function d(){return"undefined"!=typeof window&&window.VirtualScrollerDebug}function u(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}var l=function(){function e(t,n){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),this.getContainerNode=t,this.getState=n,this.reset()}var t,n,i;return t=e,(n=[{key:"reset",value:function(){this.measuredItemsHeight=0,this.firstMeasuredItemIndex=void 0,this.lastMeasuredItemIndex=void 0}},{key:"onInitItemHeights",value:function(){this.reset();for(var e=0;e<this.getState().itemHeights.length;){if(null==this.getState().itemHeights[e]){if(void 0!==this.firstMeasuredItemIndex){this.lastMeasuredItemIndex=e-1;break}}else void 0===this.firstMeasuredItemIndex&&(this.firstMeasuredItemIndex=e),this.measuredItemsHeight+=this.getState().itemHeights[e];e++}}},{key:"_getItemHeight",value:function(e,t){var n=this.getContainerNode();if(n){var i=e-t;if(i>=0&&i<n.childNodes.length)return n.childNodes[i].getBoundingClientRect().height}}},{key:"getItemSpacing",value:function(){var e=this.getContainerNode();if(e&&e.childNodes.length>1){var t=e.childNodes[0],n=e.childNodes[1],i=t.getBoundingClientRect(),o=n.getBoundingClientRect().top-(i.top+i.height);return window.VirtualScrollerDebug&&h("Measure item spacing",o),o}}},{key:"update",value:function(e,t,n){void 0===this.getState().itemSpacing&&(this.getState().itemSpacing=this.getItemSpacing()),void 0!==this.firstMeasuredItemIndex&&(e>this.lastMeasuredItemIndex+1||t<this.firstMeasuredItemIndex-1)&&this.reset();for(var i=this.firstMeasuredItemIndex,o=this.lastMeasuredItemIndex,r=!1,s=e;s<=t;){var a=this._getItemHeight(s,n);void 0!==a&&(this.set(s,a),(void 0===i||s<i)&&(this.measuredItemsHeight+=a,r||(this.firstMeasuredItemIndex=s,r=!0)),(void 0===o||s>o)&&(void 0!==o&&(this.measuredItemsHeight+=a),this.lastMeasuredItemIndex=s)),s++}}},{key:"updateItemHeight",value:function(e,t){var n=this.get(e),i=this._getItemHeight(e,t);void 0!==n&&void 0!==i&&(this.set(e,i),this.measuredItemsHeight+=i-n)}},{key:"getAverage",value:function(){return this.measuredItemsHeight?this.measuredItemsHeight/(this.lastMeasuredItemIndex-this.firstMeasuredItemIndex+1):0}},{key:"get",value:function(e){return this.getState().itemHeights[e]}},{key:"set",value:function(e,t){this.getState().itemHeights[e]=t}},{key:"onPrepend",value:function(e){void 0!==this.firstMeasuredItemIndex&&(this.firstMeasuredItemIndex+=e,this.lastMeasuredItemIndex+=e)}}])&&u(t.prototype,n),i&&u(t,i),e}();function m(e){return e.toFixed(2)+"px"}function c(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{},i=Object.keys(n);"function"==typeof Object.getOwnPropertySymbols&&(i=i.concat(Object.getOwnPropertySymbols(n).filter(function(e){return Object.getOwnPropertyDescriptor(n,e).enumerable}))),i.forEach(function(t){I(e,t,n[t])})}return e}function g(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}function I(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}var f=250,S=function(){function a(i,r){var u,m,g,S=this,p=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,a),I(this,"updateLayout",function(){return S.onUpdateShownItemIndexes({reason:"manual"})}),I(this,"onScroll",function(){return S.onUpdateShownItemIndexes({reason:"scroll"})}),I(this,"restoreScrollPosition",function(){var e=S.getState().scrollY;void 0!==e&&window.scrollTo(0,e)}),I(this,"updateScrollPosition",function(){return S.getState().scrollY=o()}),I(this,"layout",function(){return S.updateLayout()}),I(this,"onResize",(u=function(e){S.isMounted&&S.shouldUpdateLayoutOnWindowResize(e)&&(h("~ Window width changed, re-measure item heights. ~"),S.setState(S.getInitialLayoutState(),function(){S.onInitialRender("resize")}))},m=f,function(){clearTimeout(g),g=setTimeout(u,m)})),I(this,"updateShownItemIndexes",function(e){var t=S.getShownItemIndexes(),n=t.firstShownItemIndex,i=t.lastShownItemIndex,o=t.redoLayoutAfterRender,r=S.getBeforeItemsHeight(n,i),s=S.getAfterItemsHeight(n,i);S.updateWillBeHiddenItemHeightsAndState(n,i),h("~ Layout results "+(S.bypass?"(bypass) ":"")+"~"),h("First shown item index",n),h("Last shown item index",i),h("Before items height",r),h("After items height (actual or estimated)",s),h("Average item height (calculated on previous render)",S.itemHeights.getAverage()),d()&&(h("Item heights",S.getState().itemHeights.slice()),h("Item states",S.getState().itemStates.slice())),o&&h("Schedule a re-layout after the upcoming rerender"),void 0!==S.firstSeenItemIndex&&(n>S.lastSeenItemIndex+1||i<S.firstSeenItemIndex-1)&&(S.firstSeenItemIndex=void 0,S.lastSeenItemIndex=void 0),S.onBeforeShowItems(n,i),S.setState({firstShownItemIndex:n,lastShownItemIndex:i,beforeItemsHeight:r,afterItemsHeight:s},function(){return e(o)})}),I(this,"updateShownItemIndexesRecursive",function(){S.updateShownItemIndexes(function(e){e?setTimeout(function(){S.isMounted?S.updateShownItemIndexesRecursive():S.onDoneUpdatingItemIndexes()},0):S.onDoneUpdatingItemIndexes()})}),I(this,"restoreScroll",function(){var e=S.restoreScrollAfterPrepend,t=e.index,n=e.screenTop;S.restoreScrollAfterPrepend=void 0;var i=S.getItemElement(t).getBoundingClientRect().top-n;0!==i&&(h("Restore scroll position: scroll by",i),window.scrollTo(0,o()+i))}),I(this,"onUpdateShownItemIndexes",function(e){var t=e.reason;e.force;if(0!==S.getItemsCount()&&!S.isUpdatingItemIndexes){if(clearTimeout(S.onUserStopsScrollingTimeout),"scroll"===t){var n=void 0!==S.latestLayoutScreenTopAfterMargin&&o()<S.latestLayoutScreenTopAfterMargin&&S.getState().firstShownItemIndex>0||void 0!==S.latestLayoutScreenBottomAfterMargin&&o()+s()>S.latestLayoutScreenBottomAfterMargin&&S.getState().lastShownItemIndex<S.getItemsCount()-1;if(h(n?"The user has scrolled far enough: force re-render":"The user hasn't scrolled too much: delay re-render"),!n)return S.onUserStopsScrollingTimeout=setTimeout(S.onUserStoppedScrolling,100)}h("~ Update layout (on ".concat(t,") ~")),S.isUpdatingItemIndexes=!0,S.updateShownItemIndexesRecursive()}}),I(this,"onUserStoppedScrolling",function(){S.isMounted&&S.updateLayout("stopped scrolling")});var v=p.getState,y=p.setState,w=p.onStateChange,x=p.customState,b=p.preserveScrollPositionAtBottomOnMount,H=p.shouldUpdateLayoutOnWindowResize,C=p.measureItemsBatchSize,k=p.tbody,O=p.bypass,M=p.estimatedItemHeight,A=p.onItemFirstRender,P=p.state;h("~ Initialize ~"),P&&(r=P.items),this.bypass=O,this.initialItems=r,this.estimatedItemHeight=M,this._shouldUpdateLayoutOnWindowResize=H,this.measureItemsBatchSize=void 0===C?50:C,k&&(h("~ <tbody/> detected ~"),this.tbody=!0),A&&(this.onItemFirstRender=A),i()&&function(e){for(;e.firstChild;)e.removeChild(e.firstChild)}(i()),y?(this.getState=v,this.setState=y):(this.getState=function(){return S.state},this.setState=function(i,o){var r=S.state;S.state=c({},r,i),function(i,o){if(n(i,o))return!0;if("object"!==e(i)||null===i||"object"!==e(o)||null===o)return!1;var r=Object.keys(i),s=Object.keys(o);if(r.length!==s.length)return!1;for(var a=0;a<r.length;a++)if(!t.call(o,r[a])||!n(i[r[a]],o[r[a]]))return!1;return!0}(S.state,r)||(w&&w(S.state,r),S.isMounted&&S.onUpdate(r)),o&&o()}),P&&h("Initial state (passed)",P),this.getContainerNode=i,this.itemHeights=new l(i,this.getState),b&&(this.preserveScrollPositionAtBottomOnMount={documentHeight:document.documentElement.scrollHeight}),this.setState(P||this.getInitialState(x),function(){S.itemHeights.onInitItemHeights()}),h("Items count",r.length),M&&h("Estimated item height",M)}var u,S,p;return u=a,(S=[{key:"getInitialState",value:function(e){var t=this.initialItems.length,n=c({},e,this.getInitialLayoutState(),{items:this.initialItems,itemStates:new Array(t)});return h("Initial state (autogenerated)",n),h("First shown item index",n.firstShownItemIndex),h("Last shown item index",n.lastShownItemIndex),n}},{key:"getInitialLayoutState",value:function(){var e,t,n=this.initialItems.length;return n>0&&(e=0,t=this.getLastShownItemIndex(e,n)),this.preserveScrollPositionAtBottomOnMount&&(e=0,t=n-1),this.onBeforeShowItems(e,t),{itemHeights:new Array(n),itemSpacing:void 0,beforeItemsHeight:0,afterItemsHeight:0,firstShownItemIndex:e,lastShownItemIndex:t,scrollY:void 0}}},{key:"getEstimatedItemHeight",value:function(){return this.itemHeights&&this.itemHeights.getAverage()||this.estimatedItemHeight||0}},{key:"getItemSpacing",value:function(){return this.getState()&&this.getState().itemSpacing||0}},{key:"getEstimatedItemsCount",value:function(e){return this.getEstimatedItemHeight()?Math.ceil((e+this.getItemSpacing())/(this.getEstimatedItemHeight()+this.getItemSpacing())):1}},{key:"getEstimatedItemsCountOnScreen",value:function(){return"undefined"!=typeof window?this.getEstimatedItemsCount(2*this.getMargin()+window.innerHeight):1}},{key:"getLastShownItemIndex",value:function(e,t){return this.bypass?t-1:Math.min(e+(this.getEstimatedItemsCountOnScreen()-1),t-1)}},{key:"getItemsCount",value:function(){return this.getState().items.length}},{key:"getMargin",value:function(){return window.innerHeight}},{key:"onBeforeShowItems",value:function(e,t){if(this.onItemFirstRender)if(void 0===this.firstSeenItemIndex){for(var n=e;n<=t;)this.onItemFirstRender(n),n++;this.firstSeenItemIndex=e,this.lastSeenItemIndex=t}else{if(e<this.firstSeenItemIndex){for(var i=e,o=Math.min(t,this.firstSeenItemIndex-1),r=i;r<=o;)this.onItemFirstRender(r),r++;this.firstSeenItemIndex=e}if(t>this.lastSeenItemIndex){for(var s=t,a=Math.max(e,this.lastSeenItemIndex+1);a<=s;)this.onItemFirstRender(a),a++;this.lastSeenItemIndex=t}}}},{key:"onMount",value:function(){this.isMounted=!0,this.onInitialRender("mount"),this.screenWidth=r(),this.screenHeight=s(),this.restoreScrollPosition(),this.updateScrollPosition(),window.addEventListener("scroll",this.updateScrollPosition),this.bypass||(window.addEventListener("scroll",this.onScroll),window.addEventListener("resize",this.onResize)),this.tbody&&(!function(e){window.document.documentMode&&console.warn("[virtual-scroller] It seems like you're using Internet Explorer which doesn't support CSS variables required for a <tbody/> container. See: https://gitlab.com/catamphetamine/virtual-scroller/-/issues/1"),e.classList.add("VirtualScroller");var t=document.getElementById("VirtualScrollerStyle");t||((t=document.createElement("style")).id="VirtualScrollerStyle",t.innerText="\n\t\t\ttbody.VirtualScroller:before {\n\t\t\t\tcontent: '';\n\t\t\t\tdisplay: table-row;\n\t\t\t\theight: var(--VirtualScroller-paddingTop);\n\t\t\t}\n\t\t\ttbody.VirtualScroller:after {\n\t\t\t\tcontent: '';\n\t\t\t\tdisplay: table-row;\n\t\t\t\theight: var(--VirtualScroller-paddingBottom);\n\t\t\t}\n\t\t".replace(/[\n\t]/g,""),document.head.appendChild(t))}(this.getContainerNode()),this.updateTbodyPadding())}},{key:"onInitialRender",value:function(e){var t=this.getState(),n=t.firstShownItemIndex,i=t.lastShownItemIndex;h("~ Rendered (initial) ~"),this.getItemsCount()>0&&this.updateItemHeights(n,i),this.preserveScrollPositionAtBottomOnMount?window.scrollTo(0,o()+(document.documentElement.scrollHeight-this.preserveScrollPositionAtBottomOnMount.documentHeight)):this.onUpdateShownItemIndexes({reason:e})}},{key:"shouldUpdateLayoutOnWindowResize",value:function(e){if(document.fullscreenElement&&this.getContainerNode().contains(document.fullscreenElement))return!1;if(this._shouldUpdateLayoutOnWindowResize&&!this._shouldUpdateLayoutOnWindowResize(e))return!1;var t=r(),n=s(),i=this.screenWidth,o=this.screenHeight;return this.screenWidth=t,this.screenHeight=n,t!==i||n!==o&&(this.onUpdateShownItemIndexes({reason:"resize"}),!1)}},{key:"onUnmount",value:function(){this.isMounted=!1,window.removeEventListener("scroll",this.updateScrollPosition),this.bypass||(window.removeEventListener("scroll",this.onScroll),window.removeEventListener("resize",this.onResize),clearTimeout(this.onUserStopsScrollingTimeout),clearTimeout(this.watchContainerElementTopCoordinateTimer))}},{key:"onUpdate",value:function(e){var t=this.getState(),n=t.items,i=t.firstShownItemIndex,o=t.lastShownItemIndex;h("~ Rendered ~"),i===e.firstShownItemIndex&&o===e.lastShownItemIndex&&n===e.items||(this.updateItemHeights(i,o),this.tbody&&this.updateTbodyPadding())}},{key:"updateTbodyPadding",value:function(){var e=this.getState(),t=e.beforeItemsHeight,n=e.afterItemsHeight;!function(e,t,n){e.style.setProperty("--VirtualScroller-paddingTop",m(t)),e.style.setProperty("--VirtualScroller-paddingBottom",m(n))}(this.getContainerNode(),t,n)}},{key:"updateItemHeights",value:function(e,t){var n=this.getState().firstShownItemIndex;void 0!==e&&(h("~ Measure item heights ~"),this.itemHeights.update(e,t,n),d()&&h("Item heights",this.getState().itemHeights.slice()))}},{key:"updateItemHeight",value:function(e){var t=this.getState().firstShownItemIndex;this.itemHeights.updateItemHeight(e,t)}},{key:"onItemStateChange",value:function(e,t){d()&&(h("~ Item state changed ~"),h("Item",e),h("Previous state\n"+JSON.stringify(this.getState().itemStates[e],null,2)),h("New state\n"+JSON.stringify(t,null,2))),this.getState().itemStates[e]=t}},{key:"onItemHeightChange",value:function(e){var t=this.getState().itemHeights,n=t[e];this.updateItemHeight(e);var i=t[e];n!==i&&(h("~ Item height changed ~"),h("Item",e),h("Previous height",n),h("New height",i),this.onUpdateShownItemIndexes({reason:"item height change"}))}},{key:"getItemCoordinates",value:function(e){for(var t=i(this.getContainerNode()).top,n=0;n<e;)t+=this.getState().itemHeights[n],t+=this.getItemSpacing(),n++;return{top:t,bottom:t+this.getState().itemHeights[e],height:this.getState().itemHeights[n]}}},{key:"getVisibleItemIndexes",value:function(e,t,n){for(var i,o,r,s=0,a=!1,d=0;d<this.getItemsCount();){var u=this.itemHeights.get(d);if(void 0===u){h("Item index ".concat(d,' lies within the visible area or its "margins", but its height hasn\'t been measured yet. Mark the item as "shown", render the list, measure the item\'s height and redo the layout.')),r=d,void 0===i&&(i=d);var l=t-(n+s);o=Math.min(d+(this.getEstimatedItemsCount(l)-1),this.getItemsCount()-1),a=!0;break}if(s+=u,void 0===i&&n+s>e&&(h("First visible item index (including margin)",d),i=d),d<this.getItemsCount()-1&&(s+=this.getItemSpacing()),n+s>t){h("Last visible item index (including margin)",d),void 0!==i&&(o=d);break}d++}return void 0!==i&&void 0===o&&h("Last item index (is fully visible)",o=this.getItemsCount()-1),this.restoreScrollAfterPrepend&&(o<this.restoreScrollAfterPrepend.index&&(o=this.restoreScrollAfterPrepend.index),a=!1),a&&this.measureItemsBatchSize&&(o=Math.min(o,r+this.measureItemsBatchSize-1)),{firstShownItemIndex:i,lastShownItemIndex:o,redoLayoutAfterRender:a}}},{key:"getOffscreenListShownItemIndexes",value:function(){return{firstShownItemIndex:0,lastShownItemIndex:0,redoLayoutAfterRender:void 0===this.itemHeights.get(0)}}},{key:"getItemIndexes",value:function(e,t,n,i){if(!(i>e&&n<t))return this.getOffscreenListShownItemIndexes();var o=this.getVisibleItemIndexes(e,t,n);return void 0===o.firstShownItemIndex?this.getOffscreenListShownItemIndexes():o}},{key:"getBeforeItemsHeight",value:function(e,t){for(var n=0,i=0;i<e;)n+=this.itemHeights.get(i)||this.itemHeights.getAverage(),n+=this.getItemSpacing(),i++;return n}},{key:"getAfterItemsHeight",value:function(e,t){for(var n=0,i=t+1;i<this.getItemsCount();)n+=this.getItemSpacing(),n+=this.itemHeights.get(i)||this.itemHeights.getAverage(),i++;return n}},{key:"updateWillBeHiddenItemHeightsAndState",value:function(e,t){for(var n=this.getState().firstShownItemIndex;n<=this.getState().lastShownItemIndex;)n>=e&&n<=t||this.updateItemHeight(n),n++}},{key:"watchContainerElementTopCoordinate",value:function(){var e=this,t=Date.now();!function n(){e.isMounted&&(void 0!==e.top&&i(e.getContainerNode()).top!==e.top&&e.onUpdateShownItemIndexes({reason:"top offset change"}),Date.now()-t<3e3&&(e.watchContainerElementTopCoordinateTimer=setTimeout(n,500)))}()}},{key:"getShownItemIndexes",value:function(){if(this.bypass)return{firstShownItemIndex:0,lastShownItemIndex:this.getItemsCount()-1};var e=i(this.getContainerNode()),t=e.top,n=e.height;void 0===this.top&&this.watchContainerElementTopCoordinate(),this.top=t;var r=function(){var e=s();return{top:o(),bottom:o()+e,height:e}}(),a=r.top,h=r.bottom;return this.latestLayoutScreenTopAfterMargin=a-this.getMargin(),this.latestLayoutScreenBottomAfterMargin=h+this.getMargin(),this.getItemIndexes(a-this.getMargin(),h+this.getMargin(),t,t+n)}},{key:"onDoneUpdatingItemIndexes",value:function(){this.isUpdatingItemIndexes=!1,this.restoreScrollAfterPrepend&&this.restoreScroll()}},{key:"captureScroll",value:function(e,t,n){0!==e.length&&(void 0===n&&(n=t.indexOf(e[0])),n<0||0!==n&&(this.getState().firstShownItemIndex>0||this.restoreScrollAfterPrepend&&this.restoreScrollAfterPrepend.previousItems===e&&this.restoreScrollAfterPrepend.nextItems===t||(this.restoreScrollAfterPrepend={previousItems:e,nextItems:t,index:n,screenTop:this.getItemElement(0).getBoundingClientRect().top})))}},{key:"updateItems",value:function(e,t){return this.setItems(e,t)}},{key:"setItems",value:function(e){var t=this,n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},i=this.getState().items,o=this.getState(),r=o.firstShownItemIndex,s=o.lastShownItemIndex,a=o.beforeItemsHeight,d=o.afterItemsHeight,u=o.itemStates,l=o.itemHeights;o.itemSpacing;h("~ Update items ~");var m=function(e,t){var n=-1,i=-1;e.length>0&&(n=t.indexOf(e[0]))>=0&&function(e,t,n){var i=0;for(;i<e.length;){if(t.length<=n+i||t[n+i]!==e[i])return!1;i++}return!0}(e,t,n)&&(i=n+e.length-1);if(n>=0&&i>=0)return{prependedItemsCount:n,appendedItemsCount:t.length-(i+1)};return{prependedItemsCount:-1,appendedItemsCount:-1}}(i,e),g=m.prependedItemsCount,I=m.appendedItemsCount,f=g>0||I>0;f?(g>0&&(h("Prepended items count",g),l=new Array(g).concat(l),this.itemHeights.onPrepend(g),u&&(u=new Array(g).concat(u)),(n.preserveScrollPositionOnPrependItems||n.preserveScrollPosition)&&this.captureScroll(i,e,g)),I>0&&(h("Appended items count",I),l=l.concat(new Array(I)),u&&(u=u.concat(new Array(I)))),void 0!==this.firstSeenItemIndex&&(this.firstSeenItemIndex+=g,this.lastSeenItemIndex+=g),r+=g,s+=g,a+=this.itemHeights.getAverage()*g,d+=this.itemHeights.getAverage()*I):(h("Non-incremental items update"),h("Previous items",i),h("New items",e),l=new Array(e.length),u=new Array(e.length),this.firstSeenItemIndex=void 0,this.lastSeenItemIndex=void 0,0===e.length?(r=void 0,s=void 0):(r=0,s=this.getLastShownItemIndex(r,e.length)),a=0,d=0),h("First shown item index",r),h("Last shown item index",s),h("Before items height",a),h("After items height (actual or estimated)",d),this.onBeforeShowItems(r,s),this.setState(c({},void 0,{items:e,itemStates:u,itemHeights:l,firstShownItemIndex:r,lastShownItemIndex:s,beforeItemsHeight:a,afterItemsHeight:d}),function(){f||t.itemHeights.onInitItemHeights(),t.onUpdateShownItemIndexes({reason:"update items",force:!0})})}},{key:"getItemElement",value:function(e){return this.getContainerNode().childNodes[e]}}])&&g(u.prototype,S),p&&g(u,p),a}();function p(e,t){if(null==e)return{};var n,i,o=function(e,t){if(null==e)return{};var n,i,o={},r=Object.keys(e);for(i=0;i<r.length;i++)n=r[i],t.indexOf(n)>=0||(o[n]=e[n]);return o}(e,t);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);for(i=0;i<r.length;i++)n=r[i],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}function v(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}function y(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}return function(){function e(t,n,i){var o=this,r=arguments.length>3&&void 0!==arguments[3]?arguments[3]:{};!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),y(this,"onStateChange",function(e,t){var n=e.items,i=e.firstShownItemIndex,r=e.lastShownItemIndex,s=e.beforeItemsHeight,a=e.afterItemsHeight;h("~ On state change ~"),h("Previous state",t),h("New state",e),o.tbody||(o.container.style.paddingTop=m(s),o.container.style.paddingBottom=m(a));var d=t&&n===t.items&&t.items.length>0;if(d){h("Incremental rerender");for(var u=t.lastShownItemIndex;u>=t.firstShownItemIndex;)u>=i&&u<=r||(h("Remove item index",u),o.unmountItem(o.container.childNodes[u-t.firstShownItemIndex])),u--}else for(h("Rerender from scratch");o.container.firstChild;)o.unmountItem(o.container.firstChild);for(var l=d,c=l&&o.container.firstChild,g=i;g<=r;){if(d&&g>=t.firstShownItemIndex&&g<=t.lastShownItemIndex)l&&(l=!1);else{var I=o.renderItem(n[g]);l?(h("Prepend item index",g),o.container.insertBefore(I,c)):(h("Append item index",g),o.container.appendChild(I))}g++}}),y(this,"onUnmount",function(){o.virtualScroller.onUnmount()}),this.container=t,this.renderItem=i;var s=r.onMount,a=r.onItemUnmount,d=p(r,["onMount","onItemUnmount"]);this.onItemUnmount=a,this.tbody="TBODY"===this.container.tagName,this.virtualScroller=new S(function(){return o.container},n,function(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{},i=Object.keys(n);"function"==typeof Object.getOwnPropertySymbols&&(i=i.concat(Object.getOwnPropertySymbols(n).filter(function(e){return Object.getOwnPropertyDescriptor(n,e).enumerable}))),i.forEach(function(t){y(e,t,n[t])})}return e}({},d,{tbody:this.tbody,onStateChange:this.onStateChange})),s&&s(),this.virtualScroller.onMount()}var t,n,i;return t=e,(n=[{key:"unmountItem",value:function(e){this.container.removeChild(e),this.onItemUnmount&&this.onItemUnmount(e)}},{key:"onItemHeightChange",value:function(e){this.virtualScroller.onItemHeightChange(e)}},{key:"updateItems",value:function(e,t){this.setItems(e,t)}},{key:"setItems",value:function(e,t){this.virtualScroller.setItems(e,t)}},{key:"getItemCoordinates",value:function(e){return this.virtualScroller.getItemCoordinates(e)}}])&&v(t.prototype,n),i&&v(t,i),e}()});
 //# sourceMappingURL=virtual-scroller-dom.js.map

bundle/virtual-scroller-react.js

@@ -1,2 +0,2 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("react"),require("prop-types")):"function"==typeof define&&define.amd?define(["react","prop-types"],t):(e=e||self).VirtualScroller=t(e.React,e.PropTypes)}(this,function(e,t){"use strict";function n(e){return(n="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}e=e&&e.hasOwnProperty("default")?e.default:e,t=t&&t.hasOwnProperty("default")?t.default:t;var i=Object.prototype.hasOwnProperty;function o(e,t){return e===t?0!==e||0!==t||1/e==1/t:e!=e&&t!=t}function r(e,t){if(o(e,t))return!0;if("object"!==n(e)||null===e||"object"!==n(t)||null===t)return!1;var r=Object.keys(e),s=Object.keys(t);if(r.length!==s.length)return!1;for(var a=0;a<r.length;a++)if(!i.call(t,r[a])||!o(e[r[a]],t[r[a]]))return!1;return!0}function s(e){var t=e.getBoundingClientRect(),n=document.clientLeft||document.body.clientLeft||0,i=document.clientTop||document.body.clientTop||0,o=window.pageYOffset,r=window.pageXOffset;return{top:t.top+o-i,left:t.left+r-n,width:t.width,height:t.height}}function a(){return window.pageYOffset}function u(){return window.innerHeight}function h(){return window.innerWidth}function m(e){return function(e){if(Array.isArray(e)){for(var t=0,n=new Array(e.length);t<e.length;t++)n[t]=e[t];return n}}(e)||function(e){if(Symbol.iterator in Object(e)||"[object Arguments]"===Object.prototype.toString.call(e))return Array.from(e)}(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance")}()}function l(){if(d()){for(var e,t=arguments.length,n=new Array(t),i=0;i<t;i++)n[i]=arguments[i];(e=console).log.apply(e,m(["[virtual-scroller]"].concat(n)))}}function d(){return"undefined"!=typeof window&&window.VirtualScrollerDebug}function c(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}var f=function(){function e(t,n){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),this.getContainerNode=t,this.getState=n,this.reset()}var t,n,i;return t=e,(n=[{key:"reset",value:function(){this.measuredItemsHeight=0,this.firstMeasuredItemIndex=void 0,this.lastMeasuredItemIndex=void 0}},{key:"onInitItemHeights",value:function(){this.reset();for(var e=0;e<this.getState().itemHeights.length;){if(null==this.getState().itemHeights[e]){if(void 0!==this.firstMeasuredItemIndex){this.lastMeasuredItemIndex=e-1;break}}else void 0===this.firstMeasuredItemIndex&&(this.firstMeasuredItemIndex=e),this.measuredItemsHeight+=this.getState().itemHeights[e];e++}}},{key:"_getItemHeight",value:function(e,t){var n=this.getContainerNode();if(n){var i=e-t;if(i>=0&&i<n.childNodes.length)return n.childNodes[i].getBoundingClientRect().height}}},{key:"getItemSpacing",value:function(){var e=this.getContainerNode();if(e&&e.childNodes.length>1){var t=e.childNodes[0],n=e.childNodes[1],i=t.getBoundingClientRect(),o=n.getBoundingClientRect().top-(i.top+i.height);return window.VirtualScrollerDebug&&l("Item spacing",o),o}}},{key:"update",value:function(e,t,n){void 0===this.getState().itemSpacing&&(this.getState().itemSpacing=this.getItemSpacing()),void 0!==this.firstMeasuredItemIndex&&(e>this.lastMeasuredItemIndex+1||t<this.firstMeasuredItemIndex-1)&&this.reset();for(var i=this.firstMeasuredItemIndex,o=this.lastMeasuredItemIndex,r=!1,s=e;s<=t;){var a=this._getItemHeight(s,n);void 0!==a&&(this.set(s,a),(void 0===i||s<i)&&(this.measuredItemsHeight+=a,r||(this.firstMeasuredItemIndex=s,r=!0)),(void 0===o||s>o)&&(void 0!==o&&(this.measuredItemsHeight+=a),this.lastMeasuredItemIndex=s)),s++}}},{key:"updateItemHeight",value:function(e,t){var n=this.get(e),i=this._getItemHeight(e,t);void 0!==n&&void 0!==i&&(this.set(e,i),this.measuredItemsHeight+=i-n)}},{key:"getAverage",value:function(){return this.measuredItemsHeight?this.measuredItemsHeight/(this.lastMeasuredItemIndex-this.firstMeasuredItemIndex+1):0}},{key:"get",value:function(e){return this.getState().itemHeights[e]}},{key:"set",value:function(e,t){this.getState().itemHeights[e]=t}},{key:"onPrepend",value:function(e){void 0!==this.firstMeasuredItemIndex&&(this.firstMeasuredItemIndex+=e,this.lastMeasuredItemIndex+=e)}}])&&c(t.prototype,n),i&&c(t,i),e}();function g(e){return e.toFixed(2)+"px"}function I(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{},i=Object.keys(n);"function"==typeof Object.getOwnPropertySymbols&&(i=i.concat(Object.getOwnPropertySymbols(n).filter(function(e){return Object.getOwnPropertyDescriptor(n,e).enumerable}))),i.forEach(function(t){S(e,t,n[t])})}return e}function p(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}function S(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}var v=250,y=function(){function e(t,n){var i,o,s,h=this,m=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),S(this,"updateLayout",function(){return h.onUpdateShownItemIndexes({reason:"manual"})}),S(this,"onScroll",function(){return h.onUpdateShownItemIndexes({reason:"scroll"})}),S(this,"restoreScrollPosition",function(){var e=h.getState().scrollY;void 0!==e&&window.scrollTo(0,e)}),S(this,"updateScrollPosition",function(){return h.getState().scrollY=a()}),S(this,"layout",function(){return h.updateLayout()}),S(this,"onResize",(i=function(e){h.isMounted&&h.shouldUpdateLayoutOnWindowResize(e)&&(l("~ Window width changed, re-measure item heights. ~"),h.setState(h.getInitialLayoutState(),function(){h.onInitialRender("resize")}))},o=v,function(){clearTimeout(s),s=setTimeout(i,o)})),S(this,"updateShownItemIndexes",function(e){var t=h.getShownItemIndexes(),n=t.firstShownItemIndex,i=t.lastShownItemIndex,o=t.redoLayoutAfterRender,r=h.getBeforeItemsHeight(n,i),s=h.getAfterItemsHeight(n,i);h.updateWillBeHiddenItemHeightsAndState(n,i),l("~ Layout results "+(h.bypass?"(bypass) ":"")+"~"),l("First shown item index",n),l("Last shown item index",i),l("Before items height",r),l("After items height",s),l("Average item height (calculated on previous render)",h.itemHeights.getAverage()),d()&&(l("Item heights",h.getState().itemHeights.slice()),l("Item states",h.getState().itemStates.slice())),o&&l("Redo layout after render"),void 0!==h.firstSeenItemIndex&&(n>h.lastSeenItemIndex+1||i<h.firstSeenItemIndex-1)&&(h.firstSeenItemIndex=void 0,h.lastSeenItemIndex=void 0),h.onBeforeShowItems(n,i),h.setState({firstShownItemIndex:n,lastShownItemIndex:i,beforeItemsHeight:r,afterItemsHeight:s},function(){return e(o)})}),S(this,"updateShownItemIndexesRecursive",function(){h.updateShownItemIndexes(function(e){e?setTimeout(function(){h.isMounted?h.updateShownItemIndexesRecursive():h.onDoneUpdatingItemIndexes()},0):h.onDoneUpdatingItemIndexes()})}),S(this,"restoreScroll",function(){var e=h.restoreScrollAfterPrepend,t=e.index,n=e.screenTop;h.restoreScrollAfterPrepend=void 0;var i=h.getItemElement(t).getBoundingClientRect().top-n;0!==i&&(l("Restore scroll position: scroll by",i),window.scrollTo(0,a()+i))}),S(this,"onUpdateShownItemIndexes",function(e){var t=e.reason;e.force;if(0!==h.getItemsCount()&&!h.isUpdatingItemIndexes){if(clearTimeout(h.onUserStopsScrollingTimeout),"scroll"===t){var n=void 0!==h.latestLayoutScreenTopAfterMargin&&a()<h.latestLayoutScreenTopAfterMargin&&h.getState().firstShownItemIndex>0||void 0!==h.latestLayoutScreenBottomAfterMargin&&a()+u()>h.latestLayoutScreenBottomAfterMargin&&h.getState().lastShownItemIndex<h.getItemsCount()-1;if(l(n?"The user has scrolled far enough: force re-render":"The user hasn't scrolled too much: delay re-render"),!n)return h.onUserStopsScrollingTimeout=setTimeout(h.onUserStoppedScrolling,100)}l("~ Update layout (".concat(t,") ~")),h.isUpdatingItemIndexes=!0,h.updateShownItemIndexesRecursive()}}),S(this,"onUserStoppedScrolling",function(){h.isMounted&&h.updateLayout("stopped scrolling")});var c=m.getState,g=m.setState,p=m.onStateChange,y=m.customState,w=m.preserveScrollPositionAtBottomOnMount,x=m.shouldUpdateLayoutOnWindowResize,b=m.measureItemsBatchSize,H=m.bypass,C=m.estimatedItemHeight,O=m.onItemFirstRender,P=m.state;l("~ Initialize ~"),P&&(n=P.items),this.bypass=H,this.initialItems=n,this.estimatedItemHeight=C,this._shouldUpdateLayoutOnWindowResize=x,this.measureItemsBatchSize=void 0===b?50:b,O&&(this.onItemFirstRender=O),t()&&function(e){for(;e.firstChild;)e.removeChild(e.firstChild)}(t()),g?(this.getState=c,this.setState=g):(this.getState=function(){return h.state},this.setState=function(e,t){var n=h.state;h.state=I({},n,e),r(h.state,n)||(p&&p(h.state,n),h.isMounted&&h.onUpdate(n)),t&&t()}),P&&l("Initial state (passed)",P),this.getContainerNode=t,this.itemHeights=new f(t,this.getState),w&&(this.preserveScrollPositionAtBottomOnMount={documentHeight:document.documentElement.scrollHeight}),this.setState(P||this.getInitialState(y),function(){h.itemHeights.onInitItemHeights()}),l("Items count",n.length),C&&l("Estimated item height",C)}var t,n,i;return t=e,(n=[{key:"getInitialState",value:function(e){var t=this.initialItems.length,n=I({},e,this.getInitialLayoutState(),{items:this.initialItems,itemStates:new Array(t)});return l("Initial state (created)",n),l("First shown item index",n.firstShownItemIndex),l("Last shown item index",n.lastShownItemIndex),n}},{key:"getInitialLayoutState",value:function(){var e,t,n=this.initialItems.length;return n>0&&(e=0,t=this.getLastShownItemIndex(e,n)),this.preserveScrollPositionAtBottomOnMount&&(e=0,t=n-1),this.onBeforeShowItems(e,t),{itemHeights:new Array(n),itemSpacing:void 0,beforeItemsHeight:0,afterItemsHeight:0,firstShownItemIndex:e,lastShownItemIndex:t,scrollY:void 0}}},{key:"getEstimatedItemHeight",value:function(){return this.itemHeights&&this.itemHeights.getAverage()||this.estimatedItemHeight||0}},{key:"getItemSpacing",value:function(){return this.getState()&&this.getState().itemSpacing||0}},{key:"getEstimatedItemsCount",value:function(e){return this.getEstimatedItemHeight()?Math.ceil((e+this.getItemSpacing())/(this.getEstimatedItemHeight()+this.getItemSpacing())):1}},{key:"getEstimatedItemsCountOnScreen",value:function(){return"undefined"!=typeof window?this.getEstimatedItemsCount(window.innerHeight):1}},{key:"getLastShownItemIndex",value:function(e,t){return this.bypass?t-1:Math.min(e+(this.getEstimatedItemsCountOnScreen()-1),t-1)}},{key:"getItemsCount",value:function(){return this.getState().items.length}},{key:"getMargin",value:function(){return window.innerHeight}},{key:"onBeforeShowItems",value:function(e,t){if(this.onItemFirstRender)if(void 0===this.firstSeenItemIndex){for(var n=e;n<=t;)this.onItemFirstRender(n),n++;this.firstSeenItemIndex=e,this.lastSeenItemIndex=t}else{if(e<this.firstSeenItemIndex){for(var i=e,o=Math.min(t,this.firstSeenItemIndex-1),r=i;r<=o;)this.onItemFirstRender(r),r++;this.firstSeenItemIndex=e}if(t>this.lastSeenItemIndex){for(var s=t,a=Math.max(e,this.lastSeenItemIndex+1);a<=s;)this.onItemFirstRender(a),a++;this.lastSeenItemIndex=t}}}},{key:"onMount",value:function(){this.onInitialRender("mount"),this.isMounted=!0,this.screenWidth=h(),this.screenHeight=u(),this.restoreScrollPosition(),this.updateScrollPosition(),window.addEventListener("scroll",this.updateScrollPosition),this.bypass||(window.addEventListener("scroll",this.onScroll),window.addEventListener("resize",this.onResize))}},{key:"onInitialRender",value:function(e){var t=this.getState(),n=t.firstShownItemIndex,i=t.lastShownItemIndex;this.getItemsCount()>0&&this.updateItemHeights(n,i),this.preserveScrollPositionAtBottomOnMount?window.scrollTo(0,a()+(document.documentElement.scrollHeight-this.preserveScrollPositionAtBottomOnMount.documentHeight)):this.onUpdateShownItemIndexes({reason:e})}},{key:"shouldUpdateLayoutOnWindowResize",value:function(e){if(document.fullscreenElement&&this.getContainerNode().contains(document.fullscreenElement))return!1;if(this._shouldUpdateLayoutOnWindowResize&&!this._shouldUpdateLayoutOnWindowResize(e))return!1;var t=h(),n=u(),i=this.screenWidth,o=this.screenHeight;return this.screenWidth=t,this.screenHeight=n,t!==i||n!==o&&(this.onUpdateShownItemIndexes({reason:"resize"}),!1)}},{key:"onUnmount",value:function(){this.isMounted=!1,window.removeEventListener("scroll",this.updateScrollPosition),this.bypass||(window.removeEventListener("scroll",this.onScroll),window.removeEventListener("resize",this.onResize),clearTimeout(this.onUserStopsScrollingTimeout),clearTimeout(this.watchContainerElementTopCoordinateTimer))}},{key:"onUpdate",value:function(e){var t=this.getState(),n=t.items,i=t.firstShownItemIndex,o=t.lastShownItemIndex;i===e.firstShownItemIndex&&o===e.lastShownItemIndex&&n===e.items||this.updateItemHeights(i,o)}},{key:"updateItemHeights",value:function(e,t){var n=this.getState().firstShownItemIndex;void 0!==e&&(l("~ Measure item heights after layout ~"),this.itemHeights.update(e,t,n),d()&&l("Item heights",this.getState().itemHeights.slice()))}},{key:"updateItemHeight",value:function(e){var t=this.getState().firstShownItemIndex;this.itemHeights.updateItemHeight(e,t)}},{key:"onItemStateChange",value:function(e,t){d()&&(l("~ Item state changed ~"),l("Item",e),l("Previous state\n"+JSON.stringify(this.getState().itemStates[e],null,2)),l("New state\n"+JSON.stringify(t,null,2))),this.getState().itemStates[e]=t}},{key:"onItemHeightChange",value:function(e){var t=this.getState().itemHeights,n=t[e];this.updateItemHeight(e);var i=t[e];n!==i&&(l("~ Item height changed ~"),l("Item",e),l("Previous height",n),l("New height",i),this.onUpdateShownItemIndexes({reason:"item height change"}))}},{key:"getItemCoordinates",value:function(e){for(var t=s(this.getContainerNode()).top,n=0;n<e;)t+=this.getState().itemHeights[n],t+=this.getItemSpacing(),n++;return{top:t,bottom:t+this.getState().itemHeights[e],height:this.getState().itemHeights[n]}}},{key:"getVisibleItemIndexes",value:function(e,t,n){for(var i,o,r,s=0,a=!1,u=0;u<this.getItemsCount();){var h=this.itemHeights.get(u);if(void 0===h){l("Item ".concat(u," height hasn't been measured yet: render and redo layout")),r=u,void 0===i&&(i=u);var m=t-(n+s);o=Math.min(u+(this.getEstimatedItemsCount(m)-1),this.getItemsCount()-1),a=!0;break}if(s+=h,void 0===i&&n+s>e&&(l("First visible item index (including margin)",u),i=u),u<this.getItemsCount()-1&&(s+=this.getItemSpacing()),n+s>t){l("Last visible item index (including margin)",u),void 0!==i&&(o=u);break}u++}return void 0!==i&&void 0===o&&l("Last item index (is fully visible)",o=this.getItemsCount()-1),this.restoreScrollAfterPrepend&&(o<this.restoreScrollAfterPrepend.index&&(o=this.restoreScrollAfterPrepend.index),a=!1),a&&this.measureItemsBatchSize&&(o=Math.min(o,r+this.measureItemsBatchSize-1)),{firstShownItemIndex:i,lastShownItemIndex:o,redoLayoutAfterRender:a}}},{key:"getOffscreenListShownItemIndexes",value:function(){return{firstShownItemIndex:0,lastShownItemIndex:0,redoLayoutAfterRender:void 0===this.itemHeights.get(0)}}},{key:"getItemIndexes",value:function(e,t,n,i){if(!(i>e&&n<t))return this.getOffscreenListShownItemIndexes();var o=this.getVisibleItemIndexes(e,t,n);return void 0===o.firstShownItemIndex?this.getOffscreenListShownItemIndexes():o}},{key:"getBeforeItemsHeight",value:function(e,t){for(var n=0,i=0;i<e;)n+=this.itemHeights.get(i)||this.itemHeights.getAverage(),n+=this.getItemSpacing(),i++;return n}},{key:"getAfterItemsHeight",value:function(e,t){for(var n=0,i=t+1;i<this.getItemsCount();)n+=this.getItemSpacing(),n+=this.itemHeights.get(i)||this.itemHeights.getAverage(),i++;return n}},{key:"updateWillBeHiddenItemHeightsAndState",value:function(e,t){for(var n=this.getState().firstShownItemIndex;n<=this.getState().lastShownItemIndex;)n>=e&&n<=t||this.updateItemHeight(n),n++}},{key:"watchContainerElementTopCoordinate",value:function(){var e=this,t=Date.now();!function n(){e.isMounted&&(void 0!==e.top&&s(e.getContainerNode()).top!==e.top&&e.onUpdateShownItemIndexes({reason:"top offset change"}),Date.now()-t<3e3&&(e.watchContainerElementTopCoordinateTimer=setTimeout(n,500)))}()}},{key:"getShownItemIndexes",value:function(){if(this.bypass)return{firstShownItemIndex:0,lastShownItemIndex:this.getItemsCount()-1};var e=s(this.getContainerNode()),t=e.top,n=e.height;void 0===this.top&&this.watchContainerElementTopCoordinate(),this.top=t;var i=function(){var e=u();return{top:a(),bottom:a()+e,height:e}}(),o=i.top,r=i.bottom;return this.latestLayoutScreenTopAfterMargin=o-this.getMargin(),this.latestLayoutScreenBottomAfterMargin=r+this.getMargin(),this.getItemIndexes(o-this.getMargin(),r+this.getMargin(),t,t+n)}},{key:"onDoneUpdatingItemIndexes",value:function(){this.isUpdatingItemIndexes=!1,this.restoreScrollAfterPrepend&&this.restoreScroll()}},{key:"captureScroll",value:function(e,t,n){0!==e.length&&(void 0===n&&(n=t.indexOf(e[0])),n<0||0!==n&&(this.getState().firstShownItemIndex>0||this.restoreScrollAfterPrepend&&this.restoreScrollAfterPrepend.previousItems===e&&this.restoreScrollAfterPrepend.nextItems===t||(this.restoreScrollAfterPrepend={previousItems:e,nextItems:t,index:n,screenTop:this.getItemElement(0).getBoundingClientRect().top})))}},{key:"updateItems",value:function(e,t){return this.setItems(e,t)}},{key:"setItems",value:function(e){var t=this,n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},i=this.getState().items,o=this.getState(),r=o.firstShownItemIndex,s=o.lastShownItemIndex,a=o.beforeItemsHeight,u=o.afterItemsHeight,h=o.itemStates,m=o.itemHeights;o.itemSpacing;l("~ Update items ~");var d=w(i,e),c=d.prependedItemsCount,f=d.appendedItemsCount,g=c>0||f>0;g?(c>0&&(l("Prepended items count",c),m=new Array(c).concat(m),this.itemHeights.onPrepend(c),h&&(h=new Array(c).concat(h)),(n.preserveScrollPositionOnPrependItems||n.preserveScrollPosition)&&this.captureScroll(i,e,c)),f>0&&(l("Appended items count",f),m=m.concat(new Array(f)),h&&(h=h.concat(new Array(f)))),void 0!==this.firstSeenItemIndex&&(this.firstSeenItemIndex+=c,this.lastSeenItemIndex+=c),r+=c,s+=c,a+=this.itemHeights.getAverage()*c,u+=this.itemHeights.getAverage()*f):(l("Non-incremental items update"),l("Previous items",i),l("New items",e),m=new Array(e.length),h=new Array(e.length),this.firstSeenItemIndex=void 0,this.lastSeenItemIndex=void 0,0===e.length?(r=void 0,s=void 0):(r=0,s=this.getLastShownItemIndex(r,e.length)),a=0,u=0),l("First shown item index",r),l("Last shown item index",s),l("Before items height",a),l("After items height",u),this.onBeforeShowItems(r,s),this.setState(I({},void 0,{items:e,itemStates:h,itemHeights:m,firstShownItemIndex:r,lastShownItemIndex:s,beforeItemsHeight:a,afterItemsHeight:u}),function(){g||t.itemHeights.onInitItemHeights(),t.onUpdateShownItemIndexes({reason:"update items",force:!0})})}},{key:"getItemElement",value:function(e){return this.getContainerNode().childNodes[e]}}])&&p(t.prototype,n),i&&p(t,i),e}();function w(e,t){var n=-1,i=-1;return e.length>0&&(n=t.indexOf(e[0]))>=0&&function(e,t,n){var i=0;for(;i<e.length;){if(t.length<=n+i||t[n+i]!==e[i])return!1;i++}return!0}(e,t,n)&&(i=n+e.length-1),n>=0&&i>=0?{prependedItemsCount:n,appendedItemsCount:t.length-(i+1)}:{prependedItemsCount:-1,appendedItemsCount:-1}}function x(e){return(x="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}function b(){return(b=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(e[i]=n[i])}return e}).apply(this,arguments)}function H(e,t){if(null==e)return{};var n,i,o=function(e,t){if(null==e)return{};var n,i,o={},r=Object.keys(e);for(i=0;i<r.length;i++)n=r[i],t.indexOf(n)>=0||(o[n]=e[n]);return o}(e,t);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);for(i=0;i<r.length;i++)n=r[i],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}function C(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}function O(e){return(O=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)})(e)}function P(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}function R(e,t){return(R=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e})(e,t)}function k(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}var A=t.elementType||t.oneOfType([t.string,t.func,t.object]),M=function(t){function n(t){var i,o,r;!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,n),o=this,r=O(n).call(this,t),i=!r||"object"!==x(r)&&"function"!=typeof r?P(o):r,k(P(i),"container",e.createRef()),k(P(i),"onItemStateChange",new Array(i.props.items.length)),k(P(i),"onItemHeightChange",new Array(i.props.items.length)),k(P(i),"itemRefs",new Array(i.props.items.length)),k(P(i),"uniquePrefixes",[]),k(P(i),"updateLayout",function(){return i.virtualScroller.updateLayout()}),k(P(i),"layout",function(){return i.updateLayout()}),k(P(i),"onItemFirstRender",function(){var e=i.props.onItemFirstRender;e&&e.apply(void 0,arguments)}),k(P(i),"shouldUpdateLayoutOnWindowResize",function(){var e=i.props.shouldUpdateLayoutOnWindowResize;if(e)return e.apply(void 0,arguments)}),k(P(i),"onStateChange",function(){var e=i.props.onStateChange;e&&e.apply(void 0,arguments)});var s=i.props,a=s.items,u=s.initialState,h=s.initialCustomState,m=s.estimatedItemHeight,l=s.preserveScrollPositionAtBottomOnMount,d=s.measureItemsBatchSize,c=s.bypass;return i.previousItemsProperty=a,i.virtualScroller=new y(function(){return i.container.current},a,{estimatedItemHeight:m,bypass:c,onItemFirstRender:i.onItemFirstRender,preserveScrollPositionAtBottomOnMount:l,shouldUpdateLayoutOnWindowResize:i.shouldUpdateLayoutOnWindowResize,measureItemsBatchSize:d,state:u,customState:h,getState:function(){return i.state},setState:function(e,t){i.state?i.setState(e,t):(i.state=e,i.onStateChange(e))}}),i.generateUniquePrefix(),i}var i,o,s;return function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),t&&R(e,t)}(n,e.Component),i=n,(o=[{key:"shouldUseRefs",value:function(){var e,t=this.props.itemComponent;return(e=t).prototype&&e.prototype.isReactComponent}},{key:"getItemCoordinates",value:function(e){return this.virtualScroller.getItemCoordinates(e)}},{key:"updateItem",value:function(e){return this.renderItem(e)}},{key:"renderItem",value:function(e){var t=this;if(!this.shouldUseRefs())return console.error("[virtual-scroller] `.renderItem(i)` has been called but the `component` doesn't allow `ref`s. Only `component`s that're `React.Component`s support this feature.");if(this.itemRefs[e]&&this.itemRefs[e].current){var n=this.props.items,i=n[e];this.itemRefs[e].current.forceUpdate(function(){if(t._isMounted){var e=n.indexOf(i);e>=0&&t.virtualScroller.onItemHeightChange(e)}})}}},{key:"getItemRef",value:function(t){return this.itemRefs[t]||(this.itemRefs[t]=e.createRef()),this.itemRefs[t]}},{key:"getOnItemStateChange",value:function(e){var t=this;return this.onItemStateChange[e]||(this.onItemStateChange[e]=function(n){return t.virtualScroller.onItemStateChange(e,n)}),this.onItemStateChange[e]}},{key:"getOnItemHeightChange",value:function(e){var t=this;return this.onItemHeightChange[e]||(this.onItemHeightChange[e]=function(){return t.virtualScroller.onItemHeightChange(e)}),this.onItemHeightChange[e]}},{key:"generateUniquePrefix",value:function(){var e=String(Math.random()).slice(2);if(this.uniquePrefixes.indexOf(e)>=0)return this.generateUniquePrefix();this.uniquePrefixes.push(e),this.uniquePrefix=e}},{key:"componentDidMount",value:function(){var e=this.props.onMount;e&&e(),this.virtualScroller.onMount(),this._isMounted=!0}},{key:"componentDidUpdate",value:function(e,t){var n=this.props.onStateChange;n&&(r(this.state,t)||n(this.state,t)),this.virtualScroller.onUpdate(t);var i=this.props,o=i.items,s=i.preserveScrollPosition,a=i.preserveScrollPositionOnPrependItems;o!==e.items&&this.virtualScroller.setItems(o,{preserveScrollPositionOnPrependItems:a||s})}},{key:"componentWillUnmount",value:function(){this.virtualScroller.onUnmount(),this._isMounted=!1}},{key:"render",value:function(){var t=this,n=this.props,i=n.as,o=n.itemComponent,r=n.itemComponentProps,s=(n.items,n.estimatedItemHeight,n.bypass,n.preserveScrollPositionOnPrependItems),a=n.preserveScrollPosition,u=(n.preserveScrollPositionAtBottomOnMount,n.shouldUpdateLayoutOnWindowResize,n.measureItemsBatchSize,n.initialState,n.initialCustomState,n.onStateChange,n.onItemFirstRender,n.onMount,H(n,["as","itemComponent","itemComponentProps","items","estimatedItemHeight","bypass","preserveScrollPositionOnPrependItems","preserveScrollPosition","preserveScrollPositionAtBottomOnMount","shouldUpdateLayoutOnWindowResize","measureItemsBatchSize","initialState","initialCustomState","onStateChange","onItemFirstRender","onMount"])),h=this.virtualScroller.getState(),m=h.items,l=h.itemStates,d=h.firstShownItemIndex,c=h.lastShownItemIndex,f=h.beforeItemsHeight,I=h.afterItemsHeight,p=this.props.items,S=m;if(this.itemsPropertyWasChanged||(this.itemsPropertyWasChanged=this.props.items!==this.previousItemsProperty),this.previousItemsProperty=this.props.items,this.itemsPropertyWasChanged&&p!==S){var v=w(S,p),y=v.prependedItemsCount,x=v.appendedItemsCount;0===y&&x>0||((s||a)&&this.virtualScroller.captureScroll(S,p),this.generateUniquePrefix(),this.onItemStateChange=new Array(p.length),this.onItemHeightChange=new Array(p.length),this.itemRefs=new Array(p.length))}return e.createElement(i,b({},u,{ref:this.container,style:{paddingTop:g(f),paddingBottom:g(I)}}),m.map(function(n,i){return i>=d&&i<=c?e.createElement(o,b({},r,{ref:t.shouldUseRefs()?t.getItemRef(i):void 0,key:"".concat(t.uniquePrefix,":").concat(i),state:l&&l[i],onStateChange:t.getOnItemStateChange(i),onHeightChange:t.getOnItemHeightChange(i)}),n):null}))}}])&&C(i.prototype,o),s&&C(i,s),n}();return k(M,"propTypes",{as:A,items:t.arrayOf(t.object).isRequired,itemComponent:A.isRequired,itemComponentProps:t.object,estimatedItemHeight:t.number,bypass:t.bool,preserveScrollPositionOnPrependItems:t.bool,preserveScrollPosition:t.bool,preserveScrollPositionAtBottomOnMount:t.bool,shouldUpdateLayoutOnWindowResize:t.func,measureItemsBatchSize:t.number,onMount:t.func,onItemFirstRender:t.func,onStateChange:t.func,initialCustomState:t.object,initialState:t.shape({items:t.arrayOf(t.object).isRequired,itemStates:t.arrayOf(t.any),firstShownItemIndex:t.number.isRequired,lastShownItemIndex:t.number.isRequired,beforeItemsHeight:t.number.isRequired,afterItemsHeight:t.number.isRequired,itemHeights:t.arrayOf(t.number).isRequired,itemSpacing:t.number})}),k(M,"defaultProps",{as:"div"}),M});
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("react"),require("prop-types")):"function"==typeof define&&define.amd?define(["react","prop-types"],t):(e=e||self).VirtualScroller=t(e.React,e.PropTypes)}(this,function(e,t){"use strict";function n(e){return(n="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}e=e&&e.hasOwnProperty("default")?e.default:e,t=t&&t.hasOwnProperty("default")?t.default:t;var i=Object.prototype.hasOwnProperty;function o(e,t){return e===t?0!==e||0!==t||1/e==1/t:e!=e&&t!=t}function r(e,t){if(o(e,t))return!0;if("object"!==n(e)||null===e||"object"!==n(t)||null===t)return!1;var r=Object.keys(e),s=Object.keys(t);if(r.length!==s.length)return!1;for(var a=0;a<r.length;a++)if(!i.call(t,r[a])||!o(e[r[a]],t[r[a]]))return!1;return!0}function s(e){var t=e.getBoundingClientRect(),n=document.clientLeft||document.body.clientLeft||0,i=document.clientTop||document.body.clientTop||0,o=window.pageYOffset,r=window.pageXOffset;return{top:t.top+o-i,left:t.left+r-n,width:t.width,height:t.height}}function a(){return window.pageYOffset}function u(){return window.innerWidth}function h(){return window.innerHeight}function l(e){return function(e){if(Array.isArray(e)){for(var t=0,n=new Array(e.length);t<e.length;t++)n[t]=e[t];return n}}(e)||function(e){if(Symbol.iterator in Object(e)||"[object Arguments]"===Object.prototype.toString.call(e))return Array.from(e)}(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance")}()}function d(){if(m()){for(var e,t=arguments.length,n=new Array(t),i=0;i<t;i++)n[i]=arguments[i];(e=console).log.apply(e,l(["[virtual-scroller]"].concat(n)))}}function m(){return"undefined"!=typeof window&&window.VirtualScrollerDebug}function c(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}var g=function(){function e(t,n){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),this.getContainerNode=t,this.getState=n,this.reset()}var t,n,i;return t=e,(n=[{key:"reset",value:function(){this.measuredItemsHeight=0,this.firstMeasuredItemIndex=void 0,this.lastMeasuredItemIndex=void 0}},{key:"onInitItemHeights",value:function(){this.reset();for(var e=0;e<this.getState().itemHeights.length;){if(null==this.getState().itemHeights[e]){if(void 0!==this.firstMeasuredItemIndex){this.lastMeasuredItemIndex=e-1;break}}else void 0===this.firstMeasuredItemIndex&&(this.firstMeasuredItemIndex=e),this.measuredItemsHeight+=this.getState().itemHeights[e];e++}}},{key:"_getItemHeight",value:function(e,t){var n=this.getContainerNode();if(n){var i=e-t;if(i>=0&&i<n.childNodes.length)return n.childNodes[i].getBoundingClientRect().height}}},{key:"getItemSpacing",value:function(){var e=this.getContainerNode();if(e&&e.childNodes.length>1){var t=e.childNodes[0],n=e.childNodes[1],i=t.getBoundingClientRect(),o=n.getBoundingClientRect().top-(i.top+i.height);return window.VirtualScrollerDebug&&d("Measure item spacing",o),o}}},{key:"update",value:function(e,t,n){void 0===this.getState().itemSpacing&&(this.getState().itemSpacing=this.getItemSpacing()),void 0!==this.firstMeasuredItemIndex&&(e>this.lastMeasuredItemIndex+1||t<this.firstMeasuredItemIndex-1)&&this.reset();for(var i=this.firstMeasuredItemIndex,o=this.lastMeasuredItemIndex,r=!1,s=e;s<=t;){var a=this._getItemHeight(s,n);void 0!==a&&(this.set(s,a),(void 0===i||s<i)&&(this.measuredItemsHeight+=a,r||(this.firstMeasuredItemIndex=s,r=!0)),(void 0===o||s>o)&&(void 0!==o&&(this.measuredItemsHeight+=a),this.lastMeasuredItemIndex=s)),s++}}},{key:"updateItemHeight",value:function(e,t){var n=this.get(e),i=this._getItemHeight(e,t);void 0!==n&&void 0!==i&&(this.set(e,i),this.measuredItemsHeight+=i-n)}},{key:"getAverage",value:function(){return this.measuredItemsHeight?this.measuredItemsHeight/(this.lastMeasuredItemIndex-this.firstMeasuredItemIndex+1):0}},{key:"get",value:function(e){return this.getState().itemHeights[e]}},{key:"set",value:function(e,t){this.getState().itemHeights[e]=t}},{key:"onPrepend",value:function(e){void 0!==this.firstMeasuredItemIndex&&(this.firstMeasuredItemIndex+=e,this.lastMeasuredItemIndex+=e)}}])&&c(t.prototype,n),i&&c(t,i),e}();function f(e){return e.toFixed(2)+"px"}function I(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{},i=Object.keys(n);"function"==typeof Object.getOwnPropertySymbols&&(i=i.concat(Object.getOwnPropertySymbols(n).filter(function(e){return Object.getOwnPropertyDescriptor(n,e).enumerable}))),i.forEach(function(t){S(e,t,n[t])})}return e}function p(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}function S(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}var v=250,y=function(){function e(t,n){var i,o,s,u=this,l=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),S(this,"updateLayout",function(){return u.onUpdateShownItemIndexes({reason:"manual"})}),S(this,"onScroll",function(){return u.onUpdateShownItemIndexes({reason:"scroll"})}),S(this,"restoreScrollPosition",function(){var e=u.getState().scrollY;void 0!==e&&window.scrollTo(0,e)}),S(this,"updateScrollPosition",function(){return u.getState().scrollY=a()}),S(this,"layout",function(){return u.updateLayout()}),S(this,"onResize",(i=function(e){u.isMounted&&u.shouldUpdateLayoutOnWindowResize(e)&&(d("~ Window width changed, re-measure item heights. ~"),u.setState(u.getInitialLayoutState(),function(){u.onInitialRender("resize")}))},o=v,function(){clearTimeout(s),s=setTimeout(i,o)})),S(this,"updateShownItemIndexes",function(e){var t=u.getShownItemIndexes(),n=t.firstShownItemIndex,i=t.lastShownItemIndex,o=t.redoLayoutAfterRender,r=u.getBeforeItemsHeight(n,i),s=u.getAfterItemsHeight(n,i);u.updateWillBeHiddenItemHeightsAndState(n,i),d("~ Layout results "+(u.bypass?"(bypass) ":"")+"~"),d("First shown item index",n),d("Last shown item index",i),d("Before items height",r),d("After items height (actual or estimated)",s),d("Average item height (calculated on previous render)",u.itemHeights.getAverage()),m()&&(d("Item heights",u.getState().itemHeights.slice()),d("Item states",u.getState().itemStates.slice())),o&&d("Schedule a re-layout after the upcoming rerender"),void 0!==u.firstSeenItemIndex&&(n>u.lastSeenItemIndex+1||i<u.firstSeenItemIndex-1)&&(u.firstSeenItemIndex=void 0,u.lastSeenItemIndex=void 0),u.onBeforeShowItems(n,i),u.setState({firstShownItemIndex:n,lastShownItemIndex:i,beforeItemsHeight:r,afterItemsHeight:s},function(){return e(o)})}),S(this,"updateShownItemIndexesRecursive",function(){u.updateShownItemIndexes(function(e){e?setTimeout(function(){u.isMounted?u.updateShownItemIndexesRecursive():u.onDoneUpdatingItemIndexes()},0):u.onDoneUpdatingItemIndexes()})}),S(this,"restoreScroll",function(){var e=u.restoreScrollAfterPrepend,t=e.index,n=e.screenTop;u.restoreScrollAfterPrepend=void 0;var i=u.getItemElement(t).getBoundingClientRect().top-n;0!==i&&(d("Restore scroll position: scroll by",i),window.scrollTo(0,a()+i))}),S(this,"onUpdateShownItemIndexes",function(e){var t=e.reason;e.force;if(0!==u.getItemsCount()&&!u.isUpdatingItemIndexes){if(clearTimeout(u.onUserStopsScrollingTimeout),"scroll"===t){var n=void 0!==u.latestLayoutScreenTopAfterMargin&&a()<u.latestLayoutScreenTopAfterMargin&&u.getState().firstShownItemIndex>0||void 0!==u.latestLayoutScreenBottomAfterMargin&&a()+h()>u.latestLayoutScreenBottomAfterMargin&&u.getState().lastShownItemIndex<u.getItemsCount()-1;if(d(n?"The user has scrolled far enough: force re-render":"The user hasn't scrolled too much: delay re-render"),!n)return u.onUserStopsScrollingTimeout=setTimeout(u.onUserStoppedScrolling,100)}d("~ Update layout (on ".concat(t,") ~")),u.isUpdatingItemIndexes=!0,u.updateShownItemIndexesRecursive()}}),S(this,"onUserStoppedScrolling",function(){u.isMounted&&u.updateLayout("stopped scrolling")});var c=l.getState,f=l.setState,p=l.onStateChange,y=l.customState,w=l.preserveScrollPositionAtBottomOnMount,b=l.shouldUpdateLayoutOnWindowResize,x=l.measureItemsBatchSize,H=l.tbody,C=l.bypass,O=l.estimatedItemHeight,P=l.onItemFirstRender,R=l.state;d("~ Initialize ~"),R&&(n=R.items),this.bypass=C,this.initialItems=n,this.estimatedItemHeight=O,this._shouldUpdateLayoutOnWindowResize=b,this.measureItemsBatchSize=void 0===x?50:x,H&&(d("~ <tbody/> detected ~"),this.tbody=!0),P&&(this.onItemFirstRender=P),t()&&function(e){for(;e.firstChild;)e.removeChild(e.firstChild)}(t()),f?(this.getState=c,this.setState=f):(this.getState=function(){return u.state},this.setState=function(e,t){var n=u.state;u.state=I({},n,e),r(u.state,n)||(p&&p(u.state,n),u.isMounted&&u.onUpdate(n)),t&&t()}),R&&d("Initial state (passed)",R),this.getContainerNode=t,this.itemHeights=new g(t,this.getState),w&&(this.preserveScrollPositionAtBottomOnMount={documentHeight:document.documentElement.scrollHeight}),this.setState(R||this.getInitialState(y),function(){u.itemHeights.onInitItemHeights()}),d("Items count",n.length),O&&d("Estimated item height",O)}var t,n,i;return t=e,(n=[{key:"getInitialState",value:function(e){var t=this.initialItems.length,n=I({},e,this.getInitialLayoutState(),{items:this.initialItems,itemStates:new Array(t)});return d("Initial state (autogenerated)",n),d("First shown item index",n.firstShownItemIndex),d("Last shown item index",n.lastShownItemIndex),n}},{key:"getInitialLayoutState",value:function(){var e,t,n=this.initialItems.length;return n>0&&(e=0,t=this.getLastShownItemIndex(e,n)),this.preserveScrollPositionAtBottomOnMount&&(e=0,t=n-1),this.onBeforeShowItems(e,t),{itemHeights:new Array(n),itemSpacing:void 0,beforeItemsHeight:0,afterItemsHeight:0,firstShownItemIndex:e,lastShownItemIndex:t,scrollY:void 0}}},{key:"getEstimatedItemHeight",value:function(){return this.itemHeights&&this.itemHeights.getAverage()||this.estimatedItemHeight||0}},{key:"getItemSpacing",value:function(){return this.getState()&&this.getState().itemSpacing||0}},{key:"getEstimatedItemsCount",value:function(e){return this.getEstimatedItemHeight()?Math.ceil((e+this.getItemSpacing())/(this.getEstimatedItemHeight()+this.getItemSpacing())):1}},{key:"getEstimatedItemsCountOnScreen",value:function(){return"undefined"!=typeof window?this.getEstimatedItemsCount(2*this.getMargin()+window.innerHeight):1}},{key:"getLastShownItemIndex",value:function(e,t){return this.bypass?t-1:Math.min(e+(this.getEstimatedItemsCountOnScreen()-1),t-1)}},{key:"getItemsCount",value:function(){return this.getState().items.length}},{key:"getMargin",value:function(){return window.innerHeight}},{key:"onBeforeShowItems",value:function(e,t){if(this.onItemFirstRender)if(void 0===this.firstSeenItemIndex){for(var n=e;n<=t;)this.onItemFirstRender(n),n++;this.firstSeenItemIndex=e,this.lastSeenItemIndex=t}else{if(e<this.firstSeenItemIndex){for(var i=e,o=Math.min(t,this.firstSeenItemIndex-1),r=i;r<=o;)this.onItemFirstRender(r),r++;this.firstSeenItemIndex=e}if(t>this.lastSeenItemIndex){for(var s=t,a=Math.max(e,this.lastSeenItemIndex+1);a<=s;)this.onItemFirstRender(a),a++;this.lastSeenItemIndex=t}}}},{key:"onMount",value:function(){this.isMounted=!0,this.onInitialRender("mount"),this.screenWidth=u(),this.screenHeight=h(),this.restoreScrollPosition(),this.updateScrollPosition(),window.addEventListener("scroll",this.updateScrollPosition),this.bypass||(window.addEventListener("scroll",this.onScroll),window.addEventListener("resize",this.onResize)),this.tbody&&(!function(e){window.document.documentMode&&console.warn("[virtual-scroller] It seems like you're using Internet Explorer which doesn't support CSS variables required for a <tbody/> container. See: https://gitlab.com/catamphetamine/virtual-scroller/-/issues/1"),e.classList.add("VirtualScroller");var t=document.getElementById("VirtualScrollerStyle");t||((t=document.createElement("style")).id="VirtualScrollerStyle",t.innerText="\n\t\t\ttbody.VirtualScroller:before {\n\t\t\t\tcontent: '';\n\t\t\t\tdisplay: table-row;\n\t\t\t\theight: var(--VirtualScroller-paddingTop);\n\t\t\t}\n\t\t\ttbody.VirtualScroller:after {\n\t\t\t\tcontent: '';\n\t\t\t\tdisplay: table-row;\n\t\t\t\theight: var(--VirtualScroller-paddingBottom);\n\t\t\t}\n\t\t".replace(/[\n\t]/g,""),document.head.appendChild(t))}(this.getContainerNode()),this.updateTbodyPadding())}},{key:"onInitialRender",value:function(e){var t=this.getState(),n=t.firstShownItemIndex,i=t.lastShownItemIndex;d("~ Rendered (initial) ~"),this.getItemsCount()>0&&this.updateItemHeights(n,i),this.preserveScrollPositionAtBottomOnMount?window.scrollTo(0,a()+(document.documentElement.scrollHeight-this.preserveScrollPositionAtBottomOnMount.documentHeight)):this.onUpdateShownItemIndexes({reason:e})}},{key:"shouldUpdateLayoutOnWindowResize",value:function(e){if(document.fullscreenElement&&this.getContainerNode().contains(document.fullscreenElement))return!1;if(this._shouldUpdateLayoutOnWindowResize&&!this._shouldUpdateLayoutOnWindowResize(e))return!1;var t=u(),n=h(),i=this.screenWidth,o=this.screenHeight;return this.screenWidth=t,this.screenHeight=n,t!==i||n!==o&&(this.onUpdateShownItemIndexes({reason:"resize"}),!1)}},{key:"onUnmount",value:function(){this.isMounted=!1,window.removeEventListener("scroll",this.updateScrollPosition),this.bypass||(window.removeEventListener("scroll",this.onScroll),window.removeEventListener("resize",this.onResize),clearTimeout(this.onUserStopsScrollingTimeout),clearTimeout(this.watchContainerElementTopCoordinateTimer))}},{key:"onUpdate",value:function(e){var t=this.getState(),n=t.items,i=t.firstShownItemIndex,o=t.lastShownItemIndex;d("~ Rendered ~"),i===e.firstShownItemIndex&&o===e.lastShownItemIndex&&n===e.items||(this.updateItemHeights(i,o),this.tbody&&this.updateTbodyPadding())}},{key:"updateTbodyPadding",value:function(){var e=this.getState(),t=e.beforeItemsHeight,n=e.afterItemsHeight;!function(e,t,n){e.style.setProperty("--VirtualScroller-paddingTop",f(t)),e.style.setProperty("--VirtualScroller-paddingBottom",f(n))}(this.getContainerNode(),t,n)}},{key:"updateItemHeights",value:function(e,t){var n=this.getState().firstShownItemIndex;void 0!==e&&(d("~ Measure item heights ~"),this.itemHeights.update(e,t,n),m()&&d("Item heights",this.getState().itemHeights.slice()))}},{key:"updateItemHeight",value:function(e){var t=this.getState().firstShownItemIndex;this.itemHeights.updateItemHeight(e,t)}},{key:"onItemStateChange",value:function(e,t){m()&&(d("~ Item state changed ~"),d("Item",e),d("Previous state\n"+JSON.stringify(this.getState().itemStates[e],null,2)),d("New state\n"+JSON.stringify(t,null,2))),this.getState().itemStates[e]=t}},{key:"onItemHeightChange",value:function(e){var t=this.getState().itemHeights,n=t[e];this.updateItemHeight(e);var i=t[e];n!==i&&(d("~ Item height changed ~"),d("Item",e),d("Previous height",n),d("New height",i),this.onUpdateShownItemIndexes({reason:"item height change"}))}},{key:"getItemCoordinates",value:function(e){for(var t=s(this.getContainerNode()).top,n=0;n<e;)t+=this.getState().itemHeights[n],t+=this.getItemSpacing(),n++;return{top:t,bottom:t+this.getState().itemHeights[e],height:this.getState().itemHeights[n]}}},{key:"getVisibleItemIndexes",value:function(e,t,n){for(var i,o,r,s=0,a=!1,u=0;u<this.getItemsCount();){var h=this.itemHeights.get(u);if(void 0===h){d("Item index ".concat(u,' lies within the visible area or its "margins", but its height hasn\'t been measured yet. Mark the item as "shown", render the list, measure the item\'s height and redo the layout.')),r=u,void 0===i&&(i=u);var l=t-(n+s);o=Math.min(u+(this.getEstimatedItemsCount(l)-1),this.getItemsCount()-1),a=!0;break}if(s+=h,void 0===i&&n+s>e&&(d("First visible item index (including margin)",u),i=u),u<this.getItemsCount()-1&&(s+=this.getItemSpacing()),n+s>t){d("Last visible item index (including margin)",u),void 0!==i&&(o=u);break}u++}return void 0!==i&&void 0===o&&d("Last item index (is fully visible)",o=this.getItemsCount()-1),this.restoreScrollAfterPrepend&&(o<this.restoreScrollAfterPrepend.index&&(o=this.restoreScrollAfterPrepend.index),a=!1),a&&this.measureItemsBatchSize&&(o=Math.min(o,r+this.measureItemsBatchSize-1)),{firstShownItemIndex:i,lastShownItemIndex:o,redoLayoutAfterRender:a}}},{key:"getOffscreenListShownItemIndexes",value:function(){return{firstShownItemIndex:0,lastShownItemIndex:0,redoLayoutAfterRender:void 0===this.itemHeights.get(0)}}},{key:"getItemIndexes",value:function(e,t,n,i){if(!(i>e&&n<t))return this.getOffscreenListShownItemIndexes();var o=this.getVisibleItemIndexes(e,t,n);return void 0===o.firstShownItemIndex?this.getOffscreenListShownItemIndexes():o}},{key:"getBeforeItemsHeight",value:function(e,t){for(var n=0,i=0;i<e;)n+=this.itemHeights.get(i)||this.itemHeights.getAverage(),n+=this.getItemSpacing(),i++;return n}},{key:"getAfterItemsHeight",value:function(e,t){for(var n=0,i=t+1;i<this.getItemsCount();)n+=this.getItemSpacing(),n+=this.itemHeights.get(i)||this.itemHeights.getAverage(),i++;return n}},{key:"updateWillBeHiddenItemHeightsAndState",value:function(e,t){for(var n=this.getState().firstShownItemIndex;n<=this.getState().lastShownItemIndex;)n>=e&&n<=t||this.updateItemHeight(n),n++}},{key:"watchContainerElementTopCoordinate",value:function(){var e=this,t=Date.now();!function n(){e.isMounted&&(void 0!==e.top&&s(e.getContainerNode()).top!==e.top&&e.onUpdateShownItemIndexes({reason:"top offset change"}),Date.now()-t<3e3&&(e.watchContainerElementTopCoordinateTimer=setTimeout(n,500)))}()}},{key:"getShownItemIndexes",value:function(){if(this.bypass)return{firstShownItemIndex:0,lastShownItemIndex:this.getItemsCount()-1};var e=s(this.getContainerNode()),t=e.top,n=e.height;void 0===this.top&&this.watchContainerElementTopCoordinate(),this.top=t;var i=function(){var e=h();return{top:a(),bottom:a()+e,height:e}}(),o=i.top,r=i.bottom;return this.latestLayoutScreenTopAfterMargin=o-this.getMargin(),this.latestLayoutScreenBottomAfterMargin=r+this.getMargin(),this.getItemIndexes(o-this.getMargin(),r+this.getMargin(),t,t+n)}},{key:"onDoneUpdatingItemIndexes",value:function(){this.isUpdatingItemIndexes=!1,this.restoreScrollAfterPrepend&&this.restoreScroll()}},{key:"captureScroll",value:function(e,t,n){0!==e.length&&(void 0===n&&(n=t.indexOf(e[0])),n<0||0!==n&&(this.getState().firstShownItemIndex>0||this.restoreScrollAfterPrepend&&this.restoreScrollAfterPrepend.previousItems===e&&this.restoreScrollAfterPrepend.nextItems===t||(this.restoreScrollAfterPrepend={previousItems:e,nextItems:t,index:n,screenTop:this.getItemElement(0).getBoundingClientRect().top})))}},{key:"updateItems",value:function(e,t){return this.setItems(e,t)}},{key:"setItems",value:function(e){var t=this,n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},i=this.getState().items,o=this.getState(),r=o.firstShownItemIndex,s=o.lastShownItemIndex,a=o.beforeItemsHeight,u=o.afterItemsHeight,h=o.itemStates,l=o.itemHeights;o.itemSpacing;d("~ Update items ~");var m=w(i,e),c=m.prependedItemsCount,g=m.appendedItemsCount,f=c>0||g>0;f?(c>0&&(d("Prepended items count",c),l=new Array(c).concat(l),this.itemHeights.onPrepend(c),h&&(h=new Array(c).concat(h)),(n.preserveScrollPositionOnPrependItems||n.preserveScrollPosition)&&this.captureScroll(i,e,c)),g>0&&(d("Appended items count",g),l=l.concat(new Array(g)),h&&(h=h.concat(new Array(g)))),void 0!==this.firstSeenItemIndex&&(this.firstSeenItemIndex+=c,this.lastSeenItemIndex+=c),r+=c,s+=c,a+=this.itemHeights.getAverage()*c,u+=this.itemHeights.getAverage()*g):(d("Non-incremental items update"),d("Previous items",i),d("New items",e),l=new Array(e.length),h=new Array(e.length),this.firstSeenItemIndex=void 0,this.lastSeenItemIndex=void 0,0===e.length?(r=void 0,s=void 0):(r=0,s=this.getLastShownItemIndex(r,e.length)),a=0,u=0),d("First shown item index",r),d("Last shown item index",s),d("Before items height",a),d("After items height (actual or estimated)",u),this.onBeforeShowItems(r,s),this.setState(I({},void 0,{items:e,itemStates:h,itemHeights:l,firstShownItemIndex:r,lastShownItemIndex:s,beforeItemsHeight:a,afterItemsHeight:u}),function(){f||t.itemHeights.onInitItemHeights(),t.onUpdateShownItemIndexes({reason:"update items",force:!0})})}},{key:"getItemElement",value:function(e){return this.getContainerNode().childNodes[e]}}])&&p(t.prototype,n),i&&p(t,i),e}();function w(e,t){var n=-1,i=-1;return e.length>0&&(n=t.indexOf(e[0]))>=0&&function(e,t,n){var i=0;for(;i<e.length;){if(t.length<=n+i||t[n+i]!==e[i])return!1;i++}return!0}(e,t,n)&&(i=n+e.length-1),n>=0&&i>=0?{prependedItemsCount:n,appendedItemsCount:t.length-(i+1)}:{prependedItemsCount:-1,appendedItemsCount:-1}}function b(e){return(b="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}function x(){return(x=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(e[i]=n[i])}return e}).apply(this,arguments)}function H(e,t){if(null==e)return{};var n,i,o=function(e,t){if(null==e)return{};var n,i,o={},r=Object.keys(e);for(i=0;i<r.length;i++)n=r[i],t.indexOf(n)>=0||(o[n]=e[n]);return o}(e,t);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);for(i=0;i<r.length;i++)n=r[i],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}function C(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}function O(e){return(O=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)})(e)}function P(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}function R(e,t){return(R=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e})(e,t)}function k(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}var M=t.elementType||t.oneOfType([t.string,t.func,t.object]),A=function(t){function n(t){var i,o,r;!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,n),o=this,r=O(n).call(this,t),i=!r||"object"!==b(r)&&"function"!=typeof r?P(o):r,k(P(i),"container",e.createRef()),k(P(i),"onItemStateChange",new Array(i.props.items.length)),k(P(i),"onItemHeightChange",new Array(i.props.items.length)),k(P(i),"itemRefs",new Array(i.props.items.length)),k(P(i),"uniquePrefixes",[]),k(P(i),"updateLayout",function(){return i.virtualScroller.updateLayout()}),k(P(i),"layout",function(){return i.updateLayout()}),k(P(i),"onItemFirstRender",function(){var e=i.props.onItemFirstRender;e&&e.apply(void 0,arguments)}),k(P(i),"shouldUpdateLayoutOnWindowResize",function(){var e=i.props.shouldUpdateLayoutOnWindowResize;if(e)return e.apply(void 0,arguments)}),k(P(i),"onStateChange",function(){var e=i.props.onStateChange;e&&e.apply(void 0,arguments)});var s=i.props,a=s.as,u=s.items,h=s.initialState,l=s.initialCustomState,d=s.estimatedItemHeight,m=s.preserveScrollPositionAtBottomOnMount,c=s.measureItemsBatchSize,g=s.bypass;return i.previousItemsProperty=u,i.virtualScroller=new y(function(){return i.container.current},u,{estimatedItemHeight:d,bypass:g,onItemFirstRender:i.onItemFirstRender,preserveScrollPositionAtBottomOnMount:m,shouldUpdateLayoutOnWindowResize:i.shouldUpdateLayoutOnWindowResize,measureItemsBatchSize:c,tbody:"tbody"===a,state:h,customState:l,getState:function(){return i.state},setState:function(e,t){i.state?i.setState(e,t):(i.state=e,i.onStateChange(e))}}),i.generateUniquePrefix(),i}var i,o,s;return function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),t&&R(e,t)}(n,e.Component),i=n,(o=[{key:"shouldUseRefs",value:function(){var e,t=this.props.itemComponent;return(e=t).prototype&&e.prototype.isReactComponent}},{key:"getItemCoordinates",value:function(e){return this.virtualScroller.getItemCoordinates(e)}},{key:"updateItem",value:function(e){return this.renderItem(e)}},{key:"renderItem",value:function(e){var t=this;if(!this.shouldUseRefs())return console.error("[virtual-scroller] `.renderItem(i)` has been called but the `component` doesn't allow `ref`s. Only `component`s that're `React.Component`s support this feature.");if(this.itemRefs[e]&&this.itemRefs[e].current){var n=this.props.items,i=n[e];this.itemRefs[e].current.forceUpdate(function(){if(t._isMounted){var e=n.indexOf(i);e>=0&&t.virtualScroller.onItemHeightChange(e)}})}}},{key:"getItemRef",value:function(t){return this.itemRefs[t]||(this.itemRefs[t]=e.createRef()),this.itemRefs[t]}},{key:"getOnItemStateChange",value:function(e){var t=this;return this.onItemStateChange[e]||(this.onItemStateChange[e]=function(n){return t.virtualScroller.onItemStateChange(e,n)}),this.onItemStateChange[e]}},{key:"getOnItemHeightChange",value:function(e){var t=this;return this.onItemHeightChange[e]||(this.onItemHeightChange[e]=function(){return t.virtualScroller.onItemHeightChange(e)}),this.onItemHeightChange[e]}},{key:"generateUniquePrefix",value:function(){var e=String(Math.random()).slice(2);if(this.uniquePrefixes.indexOf(e)>=0)return this.generateUniquePrefix();this.uniquePrefixes.push(e),this.uniquePrefix=e}},{key:"componentDidMount",value:function(){var e=this.props.onMount;e&&e(),this.virtualScroller.onMount(),this._isMounted=!0}},{key:"componentDidUpdate",value:function(e,t){var n=this.props.onStateChange;n&&(r(this.state,t)||n(this.state,t)),this.virtualScroller.onUpdate(t);var i=this.props,o=i.items,s=i.preserveScrollPosition,a=i.preserveScrollPositionOnPrependItems;o!==e.items&&this.virtualScroller.setItems(o,{preserveScrollPositionOnPrependItems:a||s})}},{key:"componentWillUnmount",value:function(){this.virtualScroller.onUnmount(),this._isMounted=!1}},{key:"render",value:function(){var t=this,n=this.props,i=n.as,o=n.itemComponent,r=n.itemComponentProps,s=(n.items,n.estimatedItemHeight,n.bypass,n.preserveScrollPositionOnPrependItems),a=n.preserveScrollPosition,u=(n.preserveScrollPositionAtBottomOnMount,n.shouldUpdateLayoutOnWindowResize,n.measureItemsBatchSize,n.initialState,n.initialCustomState,n.onStateChange,n.onItemFirstRender,n.onMount,n.className),h=H(n,["as","itemComponent","itemComponentProps","items","estimatedItemHeight","bypass","preserveScrollPositionOnPrependItems","preserveScrollPosition","preserveScrollPositionAtBottomOnMount","shouldUpdateLayoutOnWindowResize","measureItemsBatchSize","initialState","initialCustomState","onStateChange","onItemFirstRender","onMount","className"]),l=this.virtualScroller.getState(),d=l.items,m=l.itemStates,c=l.firstShownItemIndex,g=l.lastShownItemIndex,I=l.beforeItemsHeight,p=l.afterItemsHeight,S=this.props.items,v=d;if(this.itemsPropertyWasChanged||(this.itemsPropertyWasChanged=this.props.items!==this.previousItemsProperty),this.previousItemsProperty=this.props.items,this.itemsPropertyWasChanged&&S!==v){var y=w(v,S),b=y.prependedItemsCount,C=y.appendedItemsCount;0===b&&C>0||((s||a)&&this.virtualScroller.captureScroll(v,S),this.generateUniquePrefix(),this.onItemStateChange=new Array(S.length),this.onItemHeightChange=new Array(S.length),this.itemRefs=new Array(S.length))}var O=this.virtualScroller.tbody;return e.createElement(i,x({},h,{ref:this.container,className:O?u?u+" VirtualScroller":"VirtualScroller":u,style:{paddingTop:O?void 0:f(I),paddingBottom:O?void 0:f(p)}}),d.map(function(n,i){return i>=c&&i<=g?e.createElement(o,x({},r,{ref:t.shouldUseRefs()?t.getItemRef(i):void 0,key:"".concat(t.uniquePrefix,":").concat(i),state:m&&m[i],onStateChange:t.getOnItemStateChange(i),onHeightChange:t.getOnItemHeightChange(i)}),n):null}))}}])&&C(i.prototype,o),s&&C(i,s),n}();return k(A,"propTypes",{as:M,items:t.arrayOf(t.object).isRequired,itemComponent:M.isRequired,itemComponentProps:t.object,estimatedItemHeight:t.number,bypass:t.bool,preserveScrollPositionOnPrependItems:t.bool,preserveScrollPosition:t.bool,preserveScrollPositionAtBottomOnMount:t.bool,shouldUpdateLayoutOnWindowResize:t.func,measureItemsBatchSize:t.number,className:t.string,onMount:t.func,onItemFirstRender:t.func,onStateChange:t.func,initialCustomState:t.object,initialState:t.shape({items:t.arrayOf(t.object).isRequired,itemStates:t.arrayOf(t.any),firstShownItemIndex:t.number.isRequired,lastShownItemIndex:t.number.isRequired,beforeItemsHeight:t.number.isRequired,afterItemsHeight:t.number.isRequired,itemHeights:t.arrayOf(t.number).isRequired,itemSpacing:t.number})}),k(A,"defaultProps",{as:"div"}),A});
 //# sourceMappingURL=virtual-scroller-react.js.map

bundle/virtual-scroller.js

@@ -1,2 +0,2 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e=e||self).VirtualScroller=t()}(this,function(){"use strict";function e(t){return(e="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(t)}var t=Object.prototype.hasOwnProperty;function i(e,t){return e===t?0!==e||0!==t||1/e==1/t:e!=e&&t!=t}function n(e){var t=e.getBoundingClientRect(),i=document.clientLeft||document.body.clientLeft||0,n=document.clientTop||document.body.clientTop||0,s=window.pageYOffset,o=window.pageXOffset;return{top:t.top+s-n,left:t.left+o-i,width:t.width,height:t.height}}function s(){return window.pageYOffset}function o(){return window.innerHeight}function r(){return window.innerWidth}function a(e){return function(e){if(Array.isArray(e)){for(var t=0,i=new Array(e.length);t<e.length;t++)i[t]=e[t];return i}}(e)||function(e){if(Symbol.iterator in Object(e)||"[object Arguments]"===Object.prototype.toString.call(e))return Array.from(e)}(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance")}()}function h(){if(d()){for(var e,t=arguments.length,i=new Array(t),n=0;n<t;n++)i[n]=arguments[n];(e=console).log.apply(e,a(["[virtual-scroller]"].concat(i)))}}function d(){return"undefined"!=typeof window&&window.VirtualScrollerDebug}function u(e,t){for(var i=0;i<t.length;i++){var n=t[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}var m=function(){function e(t,i){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),this.getContainerNode=t,this.getState=i,this.reset()}var t,i,n;return t=e,(i=[{key:"reset",value:function(){this.measuredItemsHeight=0,this.firstMeasuredItemIndex=void 0,this.lastMeasuredItemIndex=void 0}},{key:"onInitItemHeights",value:function(){this.reset();for(var e=0;e<this.getState().itemHeights.length;){if(null==this.getState().itemHeights[e]){if(void 0!==this.firstMeasuredItemIndex){this.lastMeasuredItemIndex=e-1;break}}else void 0===this.firstMeasuredItemIndex&&(this.firstMeasuredItemIndex=e),this.measuredItemsHeight+=this.getState().itemHeights[e];e++}}},{key:"_getItemHeight",value:function(e,t){var i=this.getContainerNode();if(i){var n=e-t;if(n>=0&&n<i.childNodes.length)return i.childNodes[n].getBoundingClientRect().height}}},{key:"getItemSpacing",value:function(){var e=this.getContainerNode();if(e&&e.childNodes.length>1){var t=e.childNodes[0],i=e.childNodes[1],n=t.getBoundingClientRect(),s=i.getBoundingClientRect().top-(n.top+n.height);return window.VirtualScrollerDebug&&h("Item spacing",s),s}}},{key:"update",value:function(e,t,i){void 0===this.getState().itemSpacing&&(this.getState().itemSpacing=this.getItemSpacing()),void 0!==this.firstMeasuredItemIndex&&(e>this.lastMeasuredItemIndex+1||t<this.firstMeasuredItemIndex-1)&&this.reset();for(var n=this.firstMeasuredItemIndex,s=this.lastMeasuredItemIndex,o=!1,r=e;r<=t;){var a=this._getItemHeight(r,i);void 0!==a&&(this.set(r,a),(void 0===n||r<n)&&(this.measuredItemsHeight+=a,o||(this.firstMeasuredItemIndex=r,o=!0)),(void 0===s||r>s)&&(void 0!==s&&(this.measuredItemsHeight+=a),this.lastMeasuredItemIndex=r)),r++}}},{key:"updateItemHeight",value:function(e,t){var i=this.get(e),n=this._getItemHeight(e,t);void 0!==i&&void 0!==n&&(this.set(e,n),this.measuredItemsHeight+=n-i)}},{key:"getAverage",value:function(){return this.measuredItemsHeight?this.measuredItemsHeight/(this.lastMeasuredItemIndex-this.firstMeasuredItemIndex+1):0}},{key:"get",value:function(e){return this.getState().itemHeights[e]}},{key:"set",value:function(e,t){this.getState().itemHeights[e]=t}},{key:"onPrepend",value:function(e){void 0!==this.firstMeasuredItemIndex&&(this.firstMeasuredItemIndex+=e,this.lastMeasuredItemIndex+=e)}}])&&u(t.prototype,i),n&&u(t,n),e}();function l(e){for(var t=1;t<arguments.length;t++){var i=null!=arguments[t]?arguments[t]:{},n=Object.keys(i);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(i).filter(function(e){return Object.getOwnPropertyDescriptor(i,e).enumerable}))),n.forEach(function(t){I(e,t,i[t])})}return e}function g(e,t){for(var i=0;i<t.length;i++){var n=t[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}function I(e,t,i){return t in e?Object.defineProperty(e,t,{value:i,enumerable:!0,configurable:!0,writable:!0}):e[t]=i,e}var c=250;return function(){function a(n,r){var u,g,f,S=this,p=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,a),I(this,"updateLayout",function(){return S.onUpdateShownItemIndexes({reason:"manual"})}),I(this,"onScroll",function(){return S.onUpdateShownItemIndexes({reason:"scroll"})}),I(this,"restoreScrollPosition",function(){var e=S.getState().scrollY;void 0!==e&&window.scrollTo(0,e)}),I(this,"updateScrollPosition",function(){return S.getState().scrollY=s()}),I(this,"layout",function(){return S.updateLayout()}),I(this,"onResize",(u=function(e){S.isMounted&&S.shouldUpdateLayoutOnWindowResize(e)&&(h("~ Window width changed, re-measure item heights. ~"),S.setState(S.getInitialLayoutState(),function(){S.onInitialRender("resize")}))},g=c,function(){clearTimeout(f),f=setTimeout(u,g)})),I(this,"updateShownItemIndexes",function(e){var t=S.getShownItemIndexes(),i=t.firstShownItemIndex,n=t.lastShownItemIndex,s=t.redoLayoutAfterRender,o=S.getBeforeItemsHeight(i,n),r=S.getAfterItemsHeight(i,n);S.updateWillBeHiddenItemHeightsAndState(i,n),h("~ Layout results "+(S.bypass?"(bypass) ":"")+"~"),h("First shown item index",i),h("Last shown item index",n),h("Before items height",o),h("After items height",r),h("Average item height (calculated on previous render)",S.itemHeights.getAverage()),d()&&(h("Item heights",S.getState().itemHeights.slice()),h("Item states",S.getState().itemStates.slice())),s&&h("Redo layout after render"),void 0!==S.firstSeenItemIndex&&(i>S.lastSeenItemIndex+1||n<S.firstSeenItemIndex-1)&&(S.firstSeenItemIndex=void 0,S.lastSeenItemIndex=void 0),S.onBeforeShowItems(i,n),S.setState({firstShownItemIndex:i,lastShownItemIndex:n,beforeItemsHeight:o,afterItemsHeight:r},function(){return e(s)})}),I(this,"updateShownItemIndexesRecursive",function(){S.updateShownItemIndexes(function(e){e?setTimeout(function(){S.isMounted?S.updateShownItemIndexesRecursive():S.onDoneUpdatingItemIndexes()},0):S.onDoneUpdatingItemIndexes()})}),I(this,"restoreScroll",function(){var e=S.restoreScrollAfterPrepend,t=e.index,i=e.screenTop;S.restoreScrollAfterPrepend=void 0;var n=S.getItemElement(t).getBoundingClientRect().top-i;0!==n&&(h("Restore scroll position: scroll by",n),window.scrollTo(0,s()+n))}),I(this,"onUpdateShownItemIndexes",function(e){var t=e.reason;e.force;if(0!==S.getItemsCount()&&!S.isUpdatingItemIndexes){if(clearTimeout(S.onUserStopsScrollingTimeout),"scroll"===t){var i=void 0!==S.latestLayoutScreenTopAfterMargin&&s()<S.latestLayoutScreenTopAfterMargin&&S.getState().firstShownItemIndex>0||void 0!==S.latestLayoutScreenBottomAfterMargin&&s()+o()>S.latestLayoutScreenBottomAfterMargin&&S.getState().lastShownItemIndex<S.getItemsCount()-1;if(h(i?"The user has scrolled far enough: force re-render":"The user hasn't scrolled too much: delay re-render"),!i)return S.onUserStopsScrollingTimeout=setTimeout(S.onUserStoppedScrolling,100)}h("~ Update layout (".concat(t,") ~")),S.isUpdatingItemIndexes=!0,S.updateShownItemIndexesRecursive()}}),I(this,"onUserStoppedScrolling",function(){S.isMounted&&S.updateLayout("stopped scrolling")});var v=p.getState,w=p.setState,y=p.onStateChange,x=p.customState,H=p.preserveScrollPositionAtBottomOnMount,b=p.shouldUpdateLayoutOnWindowResize,A=p.measureItemsBatchSize,C=p.bypass,k=p.estimatedItemHeight,M=p.onItemFirstRender,L=p.state;h("~ Initialize ~"),L&&(r=L.items),this.bypass=C,this.initialItems=r,this.estimatedItemHeight=k,this._shouldUpdateLayoutOnWindowResize=b,this.measureItemsBatchSize=void 0===A?50:A,M&&(this.onItemFirstRender=M),n()&&function(e){for(;e.firstChild;)e.removeChild(e.firstChild)}(n()),w?(this.getState=v,this.setState=w):(this.getState=function(){return S.state},this.setState=function(n,s){var o=S.state;S.state=l({},o,n),function(n,s){if(i(n,s))return!0;if("object"!==e(n)||null===n||"object"!==e(s)||null===s)return!1;var o=Object.keys(n),r=Object.keys(s);if(o.length!==r.length)return!1;for(var a=0;a<o.length;a++)if(!t.call(s,o[a])||!i(n[o[a]],s[o[a]]))return!1;return!0}(S.state,o)||(y&&y(S.state,o),S.isMounted&&S.onUpdate(o)),s&&s()}),L&&h("Initial state (passed)",L),this.getContainerNode=n,this.itemHeights=new m(n,this.getState),H&&(this.preserveScrollPositionAtBottomOnMount={documentHeight:document.documentElement.scrollHeight}),this.setState(L||this.getInitialState(x),function(){S.itemHeights.onInitItemHeights()}),h("Items count",r.length),k&&h("Estimated item height",k)}var u,f,S;return u=a,(f=[{key:"getInitialState",value:function(e){var t=this.initialItems.length,i=l({},e,this.getInitialLayoutState(),{items:this.initialItems,itemStates:new Array(t)});return h("Initial state (created)",i),h("First shown item index",i.firstShownItemIndex),h("Last shown item index",i.lastShownItemIndex),i}},{key:"getInitialLayoutState",value:function(){var e,t,i=this.initialItems.length;return i>0&&(e=0,t=this.getLastShownItemIndex(e,i)),this.preserveScrollPositionAtBottomOnMount&&(e=0,t=i-1),this.onBeforeShowItems(e,t),{itemHeights:new Array(i),itemSpacing:void 0,beforeItemsHeight:0,afterItemsHeight:0,firstShownItemIndex:e,lastShownItemIndex:t,scrollY:void 0}}},{key:"getEstimatedItemHeight",value:function(){return this.itemHeights&&this.itemHeights.getAverage()||this.estimatedItemHeight||0}},{key:"getItemSpacing",value:function(){return this.getState()&&this.getState().itemSpacing||0}},{key:"getEstimatedItemsCount",value:function(e){return this.getEstimatedItemHeight()?Math.ceil((e+this.getItemSpacing())/(this.getEstimatedItemHeight()+this.getItemSpacing())):1}},{key:"getEstimatedItemsCountOnScreen",value:function(){return"undefined"!=typeof window?this.getEstimatedItemsCount(window.innerHeight):1}},{key:"getLastShownItemIndex",value:function(e,t){return this.bypass?t-1:Math.min(e+(this.getEstimatedItemsCountOnScreen()-1),t-1)}},{key:"getItemsCount",value:function(){return this.getState().items.length}},{key:"getMargin",value:function(){return window.innerHeight}},{key:"onBeforeShowItems",value:function(e,t){if(this.onItemFirstRender)if(void 0===this.firstSeenItemIndex){for(var i=e;i<=t;)this.onItemFirstRender(i),i++;this.firstSeenItemIndex=e,this.lastSeenItemIndex=t}else{if(e<this.firstSeenItemIndex){for(var n=e,s=Math.min(t,this.firstSeenItemIndex-1),o=n;o<=s;)this.onItemFirstRender(o),o++;this.firstSeenItemIndex=e}if(t>this.lastSeenItemIndex){for(var r=t,a=Math.max(e,this.lastSeenItemIndex+1);a<=r;)this.onItemFirstRender(a),a++;this.lastSeenItemIndex=t}}}},{key:"onMount",value:function(){this.onInitialRender("mount"),this.isMounted=!0,this.screenWidth=r(),this.screenHeight=o(),this.restoreScrollPosition(),this.updateScrollPosition(),window.addEventListener("scroll",this.updateScrollPosition),this.bypass||(window.addEventListener("scroll",this.onScroll),window.addEventListener("resize",this.onResize))}},{key:"onInitialRender",value:function(e){var t=this.getState(),i=t.firstShownItemIndex,n=t.lastShownItemIndex;this.getItemsCount()>0&&this.updateItemHeights(i,n),this.preserveScrollPositionAtBottomOnMount?window.scrollTo(0,s()+(document.documentElement.scrollHeight-this.preserveScrollPositionAtBottomOnMount.documentHeight)):this.onUpdateShownItemIndexes({reason:e})}},{key:"shouldUpdateLayoutOnWindowResize",value:function(e){if(document.fullscreenElement&&this.getContainerNode().contains(document.fullscreenElement))return!1;if(this._shouldUpdateLayoutOnWindowResize&&!this._shouldUpdateLayoutOnWindowResize(e))return!1;var t=r(),i=o(),n=this.screenWidth,s=this.screenHeight;return this.screenWidth=t,this.screenHeight=i,t!==n||i!==s&&(this.onUpdateShownItemIndexes({reason:"resize"}),!1)}},{key:"onUnmount",value:function(){this.isMounted=!1,window.removeEventListener("scroll",this.updateScrollPosition),this.bypass||(window.removeEventListener("scroll",this.onScroll),window.removeEventListener("resize",this.onResize),clearTimeout(this.onUserStopsScrollingTimeout),clearTimeout(this.watchContainerElementTopCoordinateTimer))}},{key:"onUpdate",value:function(e){var t=this.getState(),i=t.items,n=t.firstShownItemIndex,s=t.lastShownItemIndex;n===e.firstShownItemIndex&&s===e.lastShownItemIndex&&i===e.items||this.updateItemHeights(n,s)}},{key:"updateItemHeights",value:function(e,t){var i=this.getState().firstShownItemIndex;void 0!==e&&(h("~ Measure item heights after layout ~"),this.itemHeights.update(e,t,i),d()&&h("Item heights",this.getState().itemHeights.slice()))}},{key:"updateItemHeight",value:function(e){var t=this.getState().firstShownItemIndex;this.itemHeights.updateItemHeight(e,t)}},{key:"onItemStateChange",value:function(e,t){d()&&(h("~ Item state changed ~"),h("Item",e),h("Previous state\n"+JSON.stringify(this.getState().itemStates[e],null,2)),h("New state\n"+JSON.stringify(t,null,2))),this.getState().itemStates[e]=t}},{key:"onItemHeightChange",value:function(e){var t=this.getState().itemHeights,i=t[e];this.updateItemHeight(e);var n=t[e];i!==n&&(h("~ Item height changed ~"),h("Item",e),h("Previous height",i),h("New height",n),this.onUpdateShownItemIndexes({reason:"item height change"}))}},{key:"getItemCoordinates",value:function(e){for(var t=n(this.getContainerNode()).top,i=0;i<e;)t+=this.getState().itemHeights[i],t+=this.getItemSpacing(),i++;return{top:t,bottom:t+this.getState().itemHeights[e],height:this.getState().itemHeights[i]}}},{key:"getVisibleItemIndexes",value:function(e,t,i){for(var n,s,o,r=0,a=!1,d=0;d<this.getItemsCount();){var u=this.itemHeights.get(d);if(void 0===u){h("Item ".concat(d," height hasn't been measured yet: render and redo layout")),o=d,void 0===n&&(n=d);var m=t-(i+r);s=Math.min(d+(this.getEstimatedItemsCount(m)-1),this.getItemsCount()-1),a=!0;break}if(r+=u,void 0===n&&i+r>e&&(h("First visible item index (including margin)",d),n=d),d<this.getItemsCount()-1&&(r+=this.getItemSpacing()),i+r>t){h("Last visible item index (including margin)",d),void 0!==n&&(s=d);break}d++}return void 0!==n&&void 0===s&&h("Last item index (is fully visible)",s=this.getItemsCount()-1),this.restoreScrollAfterPrepend&&(s<this.restoreScrollAfterPrepend.index&&(s=this.restoreScrollAfterPrepend.index),a=!1),a&&this.measureItemsBatchSize&&(s=Math.min(s,o+this.measureItemsBatchSize-1)),{firstShownItemIndex:n,lastShownItemIndex:s,redoLayoutAfterRender:a}}},{key:"getOffscreenListShownItemIndexes",value:function(){return{firstShownItemIndex:0,lastShownItemIndex:0,redoLayoutAfterRender:void 0===this.itemHeights.get(0)}}},{key:"getItemIndexes",value:function(e,t,i,n){if(!(n>e&&i<t))return this.getOffscreenListShownItemIndexes();var s=this.getVisibleItemIndexes(e,t,i);return void 0===s.firstShownItemIndex?this.getOffscreenListShownItemIndexes():s}},{key:"getBeforeItemsHeight",value:function(e,t){for(var i=0,n=0;n<e;)i+=this.itemHeights.get(n)||this.itemHeights.getAverage(),i+=this.getItemSpacing(),n++;return i}},{key:"getAfterItemsHeight",value:function(e,t){for(var i=0,n=t+1;n<this.getItemsCount();)i+=this.getItemSpacing(),i+=this.itemHeights.get(n)||this.itemHeights.getAverage(),n++;return i}},{key:"updateWillBeHiddenItemHeightsAndState",value:function(e,t){for(var i=this.getState().firstShownItemIndex;i<=this.getState().lastShownItemIndex;)i>=e&&i<=t||this.updateItemHeight(i),i++}},{key:"watchContainerElementTopCoordinate",value:function(){var e=this,t=Date.now();!function i(){e.isMounted&&(void 0!==e.top&&n(e.getContainerNode()).top!==e.top&&e.onUpdateShownItemIndexes({reason:"top offset change"}),Date.now()-t<3e3&&(e.watchContainerElementTopCoordinateTimer=setTimeout(i,500)))}()}},{key:"getShownItemIndexes",value:function(){if(this.bypass)return{firstShownItemIndex:0,lastShownItemIndex:this.getItemsCount()-1};var e=n(this.getContainerNode()),t=e.top,i=e.height;void 0===this.top&&this.watchContainerElementTopCoordinate(),this.top=t;var r=function(){var e=o();return{top:s(),bottom:s()+e,height:e}}(),a=r.top,h=r.bottom;return this.latestLayoutScreenTopAfterMargin=a-this.getMargin(),this.latestLayoutScreenBottomAfterMargin=h+this.getMargin(),this.getItemIndexes(a-this.getMargin(),h+this.getMargin(),t,t+i)}},{key:"onDoneUpdatingItemIndexes",value:function(){this.isUpdatingItemIndexes=!1,this.restoreScrollAfterPrepend&&this.restoreScroll()}},{key:"captureScroll",value:function(e,t,i){0!==e.length&&(void 0===i&&(i=t.indexOf(e[0])),i<0||0!==i&&(this.getState().firstShownItemIndex>0||this.restoreScrollAfterPrepend&&this.restoreScrollAfterPrepend.previousItems===e&&this.restoreScrollAfterPrepend.nextItems===t||(this.restoreScrollAfterPrepend={previousItems:e,nextItems:t,index:i,screenTop:this.getItemElement(0).getBoundingClientRect().top})))}},{key:"updateItems",value:function(e,t){return this.setItems(e,t)}},{key:"setItems",value:function(e){var t=this,i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},n=this.getState().items,s=this.getState(),o=s.firstShownItemIndex,r=s.lastShownItemIndex,a=s.beforeItemsHeight,d=s.afterItemsHeight,u=s.itemStates,m=s.itemHeights;s.itemSpacing;h("~ Update items ~");var g=function(e,t){var i=-1,n=-1;e.length>0&&(i=t.indexOf(e[0]))>=0&&function(e,t,i){var n=0;for(;n<e.length;){if(t.length<=i+n||t[i+n]!==e[n])return!1;n++}return!0}(e,t,i)&&(n=i+e.length-1);if(i>=0&&n>=0)return{prependedItemsCount:i,appendedItemsCount:t.length-(n+1)};return{prependedItemsCount:-1,appendedItemsCount:-1}}(n,e),I=g.prependedItemsCount,c=g.appendedItemsCount,f=I>0||c>0;f?(I>0&&(h("Prepended items count",I),m=new Array(I).concat(m),this.itemHeights.onPrepend(I),u&&(u=new Array(I).concat(u)),(i.preserveScrollPositionOnPrependItems||i.preserveScrollPosition)&&this.captureScroll(n,e,I)),c>0&&(h("Appended items count",c),m=m.concat(new Array(c)),u&&(u=u.concat(new Array(c)))),void 0!==this.firstSeenItemIndex&&(this.firstSeenItemIndex+=I,this.lastSeenItemIndex+=I),o+=I,r+=I,a+=this.itemHeights.getAverage()*I,d+=this.itemHeights.getAverage()*c):(h("Non-incremental items update"),h("Previous items",n),h("New items",e),m=new Array(e.length),u=new Array(e.length),this.firstSeenItemIndex=void 0,this.lastSeenItemIndex=void 0,0===e.length?(o=void 0,r=void 0):(o=0,r=this.getLastShownItemIndex(o,e.length)),a=0,d=0),h("First shown item index",o),h("Last shown item index",r),h("Before items height",a),h("After items height",d),this.onBeforeShowItems(o,r),this.setState(l({},void 0,{items:e,itemStates:u,itemHeights:m,firstShownItemIndex:o,lastShownItemIndex:r,beforeItemsHeight:a,afterItemsHeight:d}),function(){f||t.itemHeights.onInitItemHeights(),t.onUpdateShownItemIndexes({reason:"update items",force:!0})})}},{key:"getItemElement",value:function(e){return this.getContainerNode().childNodes[e]}}])&&g(u.prototype,f),S&&g(u,S),a}()});
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e=e||self).VirtualScroller=t()}(this,function(){"use strict";function e(t){return(e="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(t)}var t=Object.prototype.hasOwnProperty;function i(e,t){return e===t?0!==e||0!==t||1/e==1/t:e!=e&&t!=t}function n(e){var t=e.getBoundingClientRect(),i=document.clientLeft||document.body.clientLeft||0,n=document.clientTop||document.body.clientTop||0,s=window.pageYOffset,o=window.pageXOffset;return{top:t.top+s-n,left:t.left+o-i,width:t.width,height:t.height}}function s(){return window.pageYOffset}function o(){return window.innerWidth}function r(){return window.innerHeight}function a(e){return function(e){if(Array.isArray(e)){for(var t=0,i=new Array(e.length);t<e.length;t++)i[t]=e[t];return i}}(e)||function(e){if(Symbol.iterator in Object(e)||"[object Arguments]"===Object.prototype.toString.call(e))return Array.from(e)}(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance")}()}function h(){if(d()){for(var e,t=arguments.length,i=new Array(t),n=0;n<t;n++)i[n]=arguments[n];(e=console).log.apply(e,a(["[virtual-scroller]"].concat(i)))}}function d(){return"undefined"!=typeof window&&window.VirtualScrollerDebug}function u(e,t){for(var i=0;i<t.length;i++){var n=t[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}var l=function(){function e(t,i){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),this.getContainerNode=t,this.getState=i,this.reset()}var t,i,n;return t=e,(i=[{key:"reset",value:function(){this.measuredItemsHeight=0,this.firstMeasuredItemIndex=void 0,this.lastMeasuredItemIndex=void 0}},{key:"onInitItemHeights",value:function(){this.reset();for(var e=0;e<this.getState().itemHeights.length;){if(null==this.getState().itemHeights[e]){if(void 0!==this.firstMeasuredItemIndex){this.lastMeasuredItemIndex=e-1;break}}else void 0===this.firstMeasuredItemIndex&&(this.firstMeasuredItemIndex=e),this.measuredItemsHeight+=this.getState().itemHeights[e];e++}}},{key:"_getItemHeight",value:function(e,t){var i=this.getContainerNode();if(i){var n=e-t;if(n>=0&&n<i.childNodes.length)return i.childNodes[n].getBoundingClientRect().height}}},{key:"getItemSpacing",value:function(){var e=this.getContainerNode();if(e&&e.childNodes.length>1){var t=e.childNodes[0],i=e.childNodes[1],n=t.getBoundingClientRect(),s=i.getBoundingClientRect().top-(n.top+n.height);return window.VirtualScrollerDebug&&h("Measure item spacing",s),s}}},{key:"update",value:function(e,t,i){void 0===this.getState().itemSpacing&&(this.getState().itemSpacing=this.getItemSpacing()),void 0!==this.firstMeasuredItemIndex&&(e>this.lastMeasuredItemIndex+1||t<this.firstMeasuredItemIndex-1)&&this.reset();for(var n=this.firstMeasuredItemIndex,s=this.lastMeasuredItemIndex,o=!1,r=e;r<=t;){var a=this._getItemHeight(r,i);void 0!==a&&(this.set(r,a),(void 0===n||r<n)&&(this.measuredItemsHeight+=a,o||(this.firstMeasuredItemIndex=r,o=!0)),(void 0===s||r>s)&&(void 0!==s&&(this.measuredItemsHeight+=a),this.lastMeasuredItemIndex=r)),r++}}},{key:"updateItemHeight",value:function(e,t){var i=this.get(e),n=this._getItemHeight(e,t);void 0!==i&&void 0!==n&&(this.set(e,n),this.measuredItemsHeight+=n-i)}},{key:"getAverage",value:function(){return this.measuredItemsHeight?this.measuredItemsHeight/(this.lastMeasuredItemIndex-this.firstMeasuredItemIndex+1):0}},{key:"get",value:function(e){return this.getState().itemHeights[e]}},{key:"set",value:function(e,t){this.getState().itemHeights[e]=t}},{key:"onPrepend",value:function(e){void 0!==this.firstMeasuredItemIndex&&(this.firstMeasuredItemIndex+=e,this.lastMeasuredItemIndex+=e)}}])&&u(t.prototype,i),n&&u(t,n),e}();function m(e){return e.toFixed(2)+"px"}function g(e){for(var t=1;t<arguments.length;t++){var i=null!=arguments[t]?arguments[t]:{},n=Object.keys(i);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(i).filter(function(e){return Object.getOwnPropertyDescriptor(i,e).enumerable}))),n.forEach(function(t){I(e,t,i[t])})}return e}function c(e,t){for(var i=0;i<t.length;i++){var n=t[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}function I(e,t,i){return t in e?Object.defineProperty(e,t,{value:i,enumerable:!0,configurable:!0,writable:!0}):e[t]=i,e}var f=250;return function(){function a(n,o){var u,m,c,S=this,p=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,a),I(this,"updateLayout",function(){return S.onUpdateShownItemIndexes({reason:"manual"})}),I(this,"onScroll",function(){return S.onUpdateShownItemIndexes({reason:"scroll"})}),I(this,"restoreScrollPosition",function(){var e=S.getState().scrollY;void 0!==e&&window.scrollTo(0,e)}),I(this,"updateScrollPosition",function(){return S.getState().scrollY=s()}),I(this,"layout",function(){return S.updateLayout()}),I(this,"onResize",(u=function(e){S.isMounted&&S.shouldUpdateLayoutOnWindowResize(e)&&(h("~ Window width changed, re-measure item heights. ~"),S.setState(S.getInitialLayoutState(),function(){S.onInitialRender("resize")}))},m=f,function(){clearTimeout(c),c=setTimeout(u,m)})),I(this,"updateShownItemIndexes",function(e){var t=S.getShownItemIndexes(),i=t.firstShownItemIndex,n=t.lastShownItemIndex,s=t.redoLayoutAfterRender,o=S.getBeforeItemsHeight(i,n),r=S.getAfterItemsHeight(i,n);S.updateWillBeHiddenItemHeightsAndState(i,n),h("~ Layout results "+(S.bypass?"(bypass) ":"")+"~"),h("First shown item index",i),h("Last shown item index",n),h("Before items height",o),h("After items height (actual or estimated)",r),h("Average item height (calculated on previous render)",S.itemHeights.getAverage()),d()&&(h("Item heights",S.getState().itemHeights.slice()),h("Item states",S.getState().itemStates.slice())),s&&h("Schedule a re-layout after the upcoming rerender"),void 0!==S.firstSeenItemIndex&&(i>S.lastSeenItemIndex+1||n<S.firstSeenItemIndex-1)&&(S.firstSeenItemIndex=void 0,S.lastSeenItemIndex=void 0),S.onBeforeShowItems(i,n),S.setState({firstShownItemIndex:i,lastShownItemIndex:n,beforeItemsHeight:o,afterItemsHeight:r},function(){return e(s)})}),I(this,"updateShownItemIndexesRecursive",function(){S.updateShownItemIndexes(function(e){e?setTimeout(function(){S.isMounted?S.updateShownItemIndexesRecursive():S.onDoneUpdatingItemIndexes()},0):S.onDoneUpdatingItemIndexes()})}),I(this,"restoreScroll",function(){var e=S.restoreScrollAfterPrepend,t=e.index,i=e.screenTop;S.restoreScrollAfterPrepend=void 0;var n=S.getItemElement(t).getBoundingClientRect().top-i;0!==n&&(h("Restore scroll position: scroll by",n),window.scrollTo(0,s()+n))}),I(this,"onUpdateShownItemIndexes",function(e){var t=e.reason;e.force;if(0!==S.getItemsCount()&&!S.isUpdatingItemIndexes){if(clearTimeout(S.onUserStopsScrollingTimeout),"scroll"===t){var i=void 0!==S.latestLayoutScreenTopAfterMargin&&s()<S.latestLayoutScreenTopAfterMargin&&S.getState().firstShownItemIndex>0||void 0!==S.latestLayoutScreenBottomAfterMargin&&s()+r()>S.latestLayoutScreenBottomAfterMargin&&S.getState().lastShownItemIndex<S.getItemsCount()-1;if(h(i?"The user has scrolled far enough: force re-render":"The user hasn't scrolled too much: delay re-render"),!i)return S.onUserStopsScrollingTimeout=setTimeout(S.onUserStoppedScrolling,100)}h("~ Update layout (on ".concat(t,") ~")),S.isUpdatingItemIndexes=!0,S.updateShownItemIndexesRecursive()}}),I(this,"onUserStoppedScrolling",function(){S.isMounted&&S.updateLayout("stopped scrolling")});var v=p.getState,y=p.setState,w=p.onStateChange,x=p.customState,b=p.preserveScrollPositionAtBottomOnMount,H=p.shouldUpdateLayoutOnWindowResize,C=p.measureItemsBatchSize,k=p.tbody,A=p.bypass,M=p.estimatedItemHeight,L=p.onItemFirstRender,P=p.state;h("~ Initialize ~"),P&&(o=P.items),this.bypass=A,this.initialItems=o,this.estimatedItemHeight=M,this._shouldUpdateLayoutOnWindowResize=H,this.measureItemsBatchSize=void 0===C?50:C,k&&(h("~ <tbody/> detected ~"),this.tbody=!0),L&&(this.onItemFirstRender=L),n()&&function(e){for(;e.firstChild;)e.removeChild(e.firstChild)}(n()),y?(this.getState=v,this.setState=y):(this.getState=function(){return S.state},this.setState=function(n,s){var o=S.state;S.state=g({},o,n),function(n,s){if(i(n,s))return!0;if("object"!==e(n)||null===n||"object"!==e(s)||null===s)return!1;var o=Object.keys(n),r=Object.keys(s);if(o.length!==r.length)return!1;for(var a=0;a<o.length;a++)if(!t.call(s,o[a])||!i(n[o[a]],s[o[a]]))return!1;return!0}(S.state,o)||(w&&w(S.state,o),S.isMounted&&S.onUpdate(o)),s&&s()}),P&&h("Initial state (passed)",P),this.getContainerNode=n,this.itemHeights=new l(n,this.getState),b&&(this.preserveScrollPositionAtBottomOnMount={documentHeight:document.documentElement.scrollHeight}),this.setState(P||this.getInitialState(x),function(){S.itemHeights.onInitItemHeights()}),h("Items count",o.length),M&&h("Estimated item height",M)}var u,S,p;return u=a,(S=[{key:"getInitialState",value:function(e){var t=this.initialItems.length,i=g({},e,this.getInitialLayoutState(),{items:this.initialItems,itemStates:new Array(t)});return h("Initial state (autogenerated)",i),h("First shown item index",i.firstShownItemIndex),h("Last shown item index",i.lastShownItemIndex),i}},{key:"getInitialLayoutState",value:function(){var e,t,i=this.initialItems.length;return i>0&&(e=0,t=this.getLastShownItemIndex(e,i)),this.preserveScrollPositionAtBottomOnMount&&(e=0,t=i-1),this.onBeforeShowItems(e,t),{itemHeights:new Array(i),itemSpacing:void 0,beforeItemsHeight:0,afterItemsHeight:0,firstShownItemIndex:e,lastShownItemIndex:t,scrollY:void 0}}},{key:"getEstimatedItemHeight",value:function(){return this.itemHeights&&this.itemHeights.getAverage()||this.estimatedItemHeight||0}},{key:"getItemSpacing",value:function(){return this.getState()&&this.getState().itemSpacing||0}},{key:"getEstimatedItemsCount",value:function(e){return this.getEstimatedItemHeight()?Math.ceil((e+this.getItemSpacing())/(this.getEstimatedItemHeight()+this.getItemSpacing())):1}},{key:"getEstimatedItemsCountOnScreen",value:function(){return"undefined"!=typeof window?this.getEstimatedItemsCount(2*this.getMargin()+window.innerHeight):1}},{key:"getLastShownItemIndex",value:function(e,t){return this.bypass?t-1:Math.min(e+(this.getEstimatedItemsCountOnScreen()-1),t-1)}},{key:"getItemsCount",value:function(){return this.getState().items.length}},{key:"getMargin",value:function(){return window.innerHeight}},{key:"onBeforeShowItems",value:function(e,t){if(this.onItemFirstRender)if(void 0===this.firstSeenItemIndex){for(var i=e;i<=t;)this.onItemFirstRender(i),i++;this.firstSeenItemIndex=e,this.lastSeenItemIndex=t}else{if(e<this.firstSeenItemIndex){for(var n=e,s=Math.min(t,this.firstSeenItemIndex-1),o=n;o<=s;)this.onItemFirstRender(o),o++;this.firstSeenItemIndex=e}if(t>this.lastSeenItemIndex){for(var r=t,a=Math.max(e,this.lastSeenItemIndex+1);a<=r;)this.onItemFirstRender(a),a++;this.lastSeenItemIndex=t}}}},{key:"onMount",value:function(){this.isMounted=!0,this.onInitialRender("mount"),this.screenWidth=o(),this.screenHeight=r(),this.restoreScrollPosition(),this.updateScrollPosition(),window.addEventListener("scroll",this.updateScrollPosition),this.bypass||(window.addEventListener("scroll",this.onScroll),window.addEventListener("resize",this.onResize)),this.tbody&&(!function(e){window.document.documentMode&&console.warn("[virtual-scroller] It seems like you're using Internet Explorer which doesn't support CSS variables required for a <tbody/> container. See: https://gitlab.com/catamphetamine/virtual-scroller/-/issues/1"),e.classList.add("VirtualScroller");var t=document.getElementById("VirtualScrollerStyle");t||((t=document.createElement("style")).id="VirtualScrollerStyle",t.innerText="\n\t\t\ttbody.VirtualScroller:before {\n\t\t\t\tcontent: '';\n\t\t\t\tdisplay: table-row;\n\t\t\t\theight: var(--VirtualScroller-paddingTop);\n\t\t\t}\n\t\t\ttbody.VirtualScroller:after {\n\t\t\t\tcontent: '';\n\t\t\t\tdisplay: table-row;\n\t\t\t\theight: var(--VirtualScroller-paddingBottom);\n\t\t\t}\n\t\t".replace(/[\n\t]/g,""),document.head.appendChild(t))}(this.getContainerNode()),this.updateTbodyPadding())}},{key:"onInitialRender",value:function(e){var t=this.getState(),i=t.firstShownItemIndex,n=t.lastShownItemIndex;h("~ Rendered (initial) ~"),this.getItemsCount()>0&&this.updateItemHeights(i,n),this.preserveScrollPositionAtBottomOnMount?window.scrollTo(0,s()+(document.documentElement.scrollHeight-this.preserveScrollPositionAtBottomOnMount.documentHeight)):this.onUpdateShownItemIndexes({reason:e})}},{key:"shouldUpdateLayoutOnWindowResize",value:function(e){if(document.fullscreenElement&&this.getContainerNode().contains(document.fullscreenElement))return!1;if(this._shouldUpdateLayoutOnWindowResize&&!this._shouldUpdateLayoutOnWindowResize(e))return!1;var t=o(),i=r(),n=this.screenWidth,s=this.screenHeight;return this.screenWidth=t,this.screenHeight=i,t!==n||i!==s&&(this.onUpdateShownItemIndexes({reason:"resize"}),!1)}},{key:"onUnmount",value:function(){this.isMounted=!1,window.removeEventListener("scroll",this.updateScrollPosition),this.bypass||(window.removeEventListener("scroll",this.onScroll),window.removeEventListener("resize",this.onResize),clearTimeout(this.onUserStopsScrollingTimeout),clearTimeout(this.watchContainerElementTopCoordinateTimer))}},{key:"onUpdate",value:function(e){var t=this.getState(),i=t.items,n=t.firstShownItemIndex,s=t.lastShownItemIndex;h("~ Rendered ~"),n===e.firstShownItemIndex&&s===e.lastShownItemIndex&&i===e.items||(this.updateItemHeights(n,s),this.tbody&&this.updateTbodyPadding())}},{key:"updateTbodyPadding",value:function(){var e=this.getState(),t=e.beforeItemsHeight,i=e.afterItemsHeight;!function(e,t,i){e.style.setProperty("--VirtualScroller-paddingTop",m(t)),e.style.setProperty("--VirtualScroller-paddingBottom",m(i))}(this.getContainerNode(),t,i)}},{key:"updateItemHeights",value:function(e,t){var i=this.getState().firstShownItemIndex;void 0!==e&&(h("~ Measure item heights ~"),this.itemHeights.update(e,t,i),d()&&h("Item heights",this.getState().itemHeights.slice()))}},{key:"updateItemHeight",value:function(e){var t=this.getState().firstShownItemIndex;this.itemHeights.updateItemHeight(e,t)}},{key:"onItemStateChange",value:function(e,t){d()&&(h("~ Item state changed ~"),h("Item",e),h("Previous state\n"+JSON.stringify(this.getState().itemStates[e],null,2)),h("New state\n"+JSON.stringify(t,null,2))),this.getState().itemStates[e]=t}},{key:"onItemHeightChange",value:function(e){var t=this.getState().itemHeights,i=t[e];this.updateItemHeight(e);var n=t[e];i!==n&&(h("~ Item height changed ~"),h("Item",e),h("Previous height",i),h("New height",n),this.onUpdateShownItemIndexes({reason:"item height change"}))}},{key:"getItemCoordinates",value:function(e){for(var t=n(this.getContainerNode()).top,i=0;i<e;)t+=this.getState().itemHeights[i],t+=this.getItemSpacing(),i++;return{top:t,bottom:t+this.getState().itemHeights[e],height:this.getState().itemHeights[i]}}},{key:"getVisibleItemIndexes",value:function(e,t,i){for(var n,s,o,r=0,a=!1,d=0;d<this.getItemsCount();){var u=this.itemHeights.get(d);if(void 0===u){h("Item index ".concat(d,' lies within the visible area or its "margins", but its height hasn\'t been measured yet. Mark the item as "shown", render the list, measure the item\'s height and redo the layout.')),o=d,void 0===n&&(n=d);var l=t-(i+r);s=Math.min(d+(this.getEstimatedItemsCount(l)-1),this.getItemsCount()-1),a=!0;break}if(r+=u,void 0===n&&i+r>e&&(h("First visible item index (including margin)",d),n=d),d<this.getItemsCount()-1&&(r+=this.getItemSpacing()),i+r>t){h("Last visible item index (including margin)",d),void 0!==n&&(s=d);break}d++}return void 0!==n&&void 0===s&&h("Last item index (is fully visible)",s=this.getItemsCount()-1),this.restoreScrollAfterPrepend&&(s<this.restoreScrollAfterPrepend.index&&(s=this.restoreScrollAfterPrepend.index),a=!1),a&&this.measureItemsBatchSize&&(s=Math.min(s,o+this.measureItemsBatchSize-1)),{firstShownItemIndex:n,lastShownItemIndex:s,redoLayoutAfterRender:a}}},{key:"getOffscreenListShownItemIndexes",value:function(){return{firstShownItemIndex:0,lastShownItemIndex:0,redoLayoutAfterRender:void 0===this.itemHeights.get(0)}}},{key:"getItemIndexes",value:function(e,t,i,n){if(!(n>e&&i<t))return this.getOffscreenListShownItemIndexes();var s=this.getVisibleItemIndexes(e,t,i);return void 0===s.firstShownItemIndex?this.getOffscreenListShownItemIndexes():s}},{key:"getBeforeItemsHeight",value:function(e,t){for(var i=0,n=0;n<e;)i+=this.itemHeights.get(n)||this.itemHeights.getAverage(),i+=this.getItemSpacing(),n++;return i}},{key:"getAfterItemsHeight",value:function(e,t){for(var i=0,n=t+1;n<this.getItemsCount();)i+=this.getItemSpacing(),i+=this.itemHeights.get(n)||this.itemHeights.getAverage(),n++;return i}},{key:"updateWillBeHiddenItemHeightsAndState",value:function(e,t){for(var i=this.getState().firstShownItemIndex;i<=this.getState().lastShownItemIndex;)i>=e&&i<=t||this.updateItemHeight(i),i++}},{key:"watchContainerElementTopCoordinate",value:function(){var e=this,t=Date.now();!function i(){e.isMounted&&(void 0!==e.top&&n(e.getContainerNode()).top!==e.top&&e.onUpdateShownItemIndexes({reason:"top offset change"}),Date.now()-t<3e3&&(e.watchContainerElementTopCoordinateTimer=setTimeout(i,500)))}()}},{key:"getShownItemIndexes",value:function(){if(this.bypass)return{firstShownItemIndex:0,lastShownItemIndex:this.getItemsCount()-1};var e=n(this.getContainerNode()),t=e.top,i=e.height;void 0===this.top&&this.watchContainerElementTopCoordinate(),this.top=t;var o=function(){var e=r();return{top:s(),bottom:s()+e,height:e}}(),a=o.top,h=o.bottom;return this.latestLayoutScreenTopAfterMargin=a-this.getMargin(),this.latestLayoutScreenBottomAfterMargin=h+this.getMargin(),this.getItemIndexes(a-this.getMargin(),h+this.getMargin(),t,t+i)}},{key:"onDoneUpdatingItemIndexes",value:function(){this.isUpdatingItemIndexes=!1,this.restoreScrollAfterPrepend&&this.restoreScroll()}},{key:"captureScroll",value:function(e,t,i){0!==e.length&&(void 0===i&&(i=t.indexOf(e[0])),i<0||0!==i&&(this.getState().firstShownItemIndex>0||this.restoreScrollAfterPrepend&&this.restoreScrollAfterPrepend.previousItems===e&&this.restoreScrollAfterPrepend.nextItems===t||(this.restoreScrollAfterPrepend={previousItems:e,nextItems:t,index:i,screenTop:this.getItemElement(0).getBoundingClientRect().top})))}},{key:"updateItems",value:function(e,t){return this.setItems(e,t)}},{key:"setItems",value:function(e){var t=this,i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},n=this.getState().items,s=this.getState(),o=s.firstShownItemIndex,r=s.lastShownItemIndex,a=s.beforeItemsHeight,d=s.afterItemsHeight,u=s.itemStates,l=s.itemHeights;s.itemSpacing;h("~ Update items ~");var m=function(e,t){var i=-1,n=-1;e.length>0&&(i=t.indexOf(e[0]))>=0&&function(e,t,i){var n=0;for(;n<e.length;){if(t.length<=i+n||t[i+n]!==e[n])return!1;n++}return!0}(e,t,i)&&(n=i+e.length-1);if(i>=0&&n>=0)return{prependedItemsCount:i,appendedItemsCount:t.length-(n+1)};return{prependedItemsCount:-1,appendedItemsCount:-1}}(n,e),c=m.prependedItemsCount,I=m.appendedItemsCount,f=c>0||I>0;f?(c>0&&(h("Prepended items count",c),l=new Array(c).concat(l),this.itemHeights.onPrepend(c),u&&(u=new Array(c).concat(u)),(i.preserveScrollPositionOnPrependItems||i.preserveScrollPosition)&&this.captureScroll(n,e,c)),I>0&&(h("Appended items count",I),l=l.concat(new Array(I)),u&&(u=u.concat(new Array(I)))),void 0!==this.firstSeenItemIndex&&(this.firstSeenItemIndex+=c,this.lastSeenItemIndex+=c),o+=c,r+=c,a+=this.itemHeights.getAverage()*c,d+=this.itemHeights.getAverage()*I):(h("Non-incremental items update"),h("Previous items",n),h("New items",e),l=new Array(e.length),u=new Array(e.length),this.firstSeenItemIndex=void 0,this.lastSeenItemIndex=void 0,0===e.length?(o=void 0,r=void 0):(o=0,r=this.getLastShownItemIndex(o,e.length)),a=0,d=0),h("First shown item index",o),h("Last shown item index",r),h("Before items height",a),h("After items height (actual or estimated)",d),this.onBeforeShowItems(o,r),this.setState(g({},void 0,{items:e,itemStates:u,itemHeights:l,firstShownItemIndex:o,lastShownItemIndex:r,beforeItemsHeight:a,afterItemsHeight:d}),function(){f||t.itemHeights.onInitItemHeights(),t.onUpdateShownItemIndexes({reason:"update items",force:!0})})}},{key:"getItemElement",value:function(e){return this.getContainerNode().childNodes[e]}}])&&c(u.prototype,S),p&&c(u,p),a}()});
 //# sourceMappingURL=virtual-scroller.js.map

CHANGELOG.md

 <!-- `virtual-scroller`: in `.updateItems()` handle a case when `items.length` is the same, in which case find different items and if those items are rendered then maybe update them on screen and update their height, if the items are past rendered then maybe just discard all item heights past rendered, if the items are before rendered then maybe ignore and it will jump on scroll up which is kinda acceptable. -->
 
+1.2.1 / 18.04.2020
+===================
+
+* Fixed an [infinite initial render loop](https://gitlab.com/catamphetamine/virtual-scroller/-/issues/1) in `DOMVirtualScroller`.
+
+* It [turned out](https://gitlab.com/catamphetamine/virtual-scroller/-/issues/1) that rendering items as `<tr/>`s inside a `<tbody/>` didn't work because a `<tbody/>` [can't have](https://stackoverflow.com/questions/294885/how-to-put-spacing-between-tbody-elements/294925) `padding`. A workaround has been added that involves CSS variables which aren't supported in Internet Explorer.
+
 1.2.0 / 27.02.2020
@@ -4,0 +11,0 @@ ===================

commonjs/DOM.js

@@ -9,4 +9,4 @@ "use strict";
 exports.clearElement = clearElement;
+exports.getScreenWidth = getScreenWidth;
 exports.getScreenHeight = getScreenHeight;
-exports.getScreenWidth = getScreenWidth;
 exports.getScreenBounds = getScreenBounds;
@@ -51,18 +51,73 @@
   }
-}
+} // export function getScreenWidth() {
+// 	// Doesn't correctly reflect page zoom in iOS Safari.
+// 	// (doesn't scale screen width accordingly).
+// 	// (but does reflect page zoom in desktop Chrome).
+// 	return document.documentElement.clientWidth
+// }
+// https://javascript.info/size-and-scroll-window
+// `<!DOCTYPE html>` may be required in order for this to work correctly.
+// Includes scrollbar (if any).
 
-function getScreenHeight() {
-  return window.innerHeight;
-}
 
 function getScreenWidth() {
+  // Correctly reflects page zoom in iOS Safari.
+  // (scales screen width accordingly).
+  // But, includes scrollbar (if any).
   return window.innerWidth;
-}
+} // export function getScreenHeight() {
+// 	// Doesn't support iOS Safari's dynamically shown/hidden
+// 	// top URL bar and bottom actions bar.
+// 	// https://codesandbox.io/s/elegant-fog-iddrh
+// 	// Tested in IE 11.
+// 	// It also doesn't correctly reflect page zoom in iOS Safari.
+// 	// (doesn't scale screen height accordingly).
+// 	// (but does reflect page zoom in desktop Chrome).
+// 	return document.documentElement.clientHeight
+// }
+// https://javascript.info/size-and-scroll-window
+// `<!DOCTYPE html>` is required in order for this to work correctly.
+// Without it, the returned height would be the height of the entire document.
+// Includes scrollbar (if any).
 
+
+function getScreenHeight() {
+  // This variant of `getScreenHeight()`
+  // supports iOS Safari's dynamically shown/hidden
+  // top URL bar and bottom actions bar.
+  // https://codesandbox.io/s/elegant-fog-iddrh
+  // Tested in IE 11.
+  // It also correctly reflects page zoom in iOS Safari.
+  // (scales screen height accordingly).
+  // But, includes scrollbar (if any).
+  return window.innerHeight;
+} // // This variant of `getScreenHeight()`
+// // supports iOS Safari's dynamically shown/hidden
+// // top URL bar and bottom actions bar.
+// // https://codesandbox.io/s/elegant-fog-iddrh
+// // Tested in IE 11.
+// // It doesn't correctly reflect page zoom in iOS Safari.
+// // (doesn't scale screen height accordingly).
+// // (but does reflect page zoom in desktop Chrome).
+// function getScreenHeight() {
+// 	const div = document.createElement('div')
+// 	div.style.position = 'fixed'
+// 	div.style.left = 0
+// 	div.style.top = 0
+// 	div.style.right = 0
+// 	div.style.bottom = 0
+// 	div.style.zIndex = -1
+// 	document.body.appendChild(div)
+// 	const height = div.clientHeight
+// 	document.body.removeChild(div)
+// 	return height
+// }
+
+
 function getScreenBounds() {
   var height = getScreenHeight();
   return {
-    // The first pixel of the viewport.
+    // The first pixel of the screen.
     top: getScrollY(),
-    // The pixel after the last pixel of the viewport.
+    // The pixel after the last pixel of the screen.
     bottom: getScrollY() + height,
@@ -69,0 +124,0 @@ height: height

commonjs/DOMVirtualScroller.js

@@ -49,10 +49,17 @@ "use strict";
       (0, _log["default"])('New state', state); // Set container padding top and bottom.
+      // Work around `<tbody/>` not being able to have `padding`.
+      // https://gitlab.com/catamphetamine/virtual-scroller/-/issues/1
+      // `this.virtualScroller` hasn't been initialized yet at this stage,
+      // so using `this.tbody` instead of `this.virtualScroller.tbody`.
 
-      _this.container.style.paddingTop = (0, _utility.px)(beforeItemsHeight);
-      _this.container.style.paddingBottom = (0, _utility.px)(afterItemsHeight); // Perform an intelligent "diff" re-render if the `items` are the same.
+      if (!_this.tbody) {
+        _this.container.style.paddingTop = (0, _utility.px)(beforeItemsHeight);
+        _this.container.style.paddingBottom = (0, _utility.px)(afterItemsHeight);
+      } // Perform an intelligent "diff" re-render if the `items` are the same.
 
+
       var diffRender = prevState && items === prevState.items && prevState.items.length > 0; // Remove no longer visible items from the DOM.
 
       if (diffRender) {
-        (0, _log["default"])('Incremental render'); // Decrement instead of increment here because
+        (0, _log["default"])('Incremental rerender'); // Decrement instead of increment here because
         // `this.container.removeChild()` changes indexes.
@@ -65,3 +72,3 @@
           } else {
-            (0, _log["default"])('Remove item', _i); // The item is no longer visible so remove it from the DOM.
+            (0, _log["default"])('Remove item index', _i); // The item is no longer visible so remove it from the DOM.
 
@@ -74,3 +81,3 @@ _this.unmountItem(_this.container.childNodes[_i - prevState.firstShownItemIndex]);
       } else {
-        (0, _log["default"])('Clean render');
+        (0, _log["default"])('Rerender from scratch');
 
@@ -98,7 +105,7 @@ while (_this.container.firstChild) {
           if (shouldPrependItems) {
-            (0, _log["default"])('Prepend item', i); // Append `item` to `this.container` before the retained items.
+            (0, _log["default"])('Prepend item index', i); // Append `item` to `this.container` before the retained items.
 
             _this.container.insertBefore(item, prependBeforeItemElement);
           } else {
-            (0, _log["default"])('Append item', i); // Append `item` to `this.container`.
+            (0, _log["default"])('Append item index', i); // Append `item` to `this.container`.
 
@@ -125,5 +132,7 @@ _this.container.appendChild(item);
     this.onItemUnmount = onItemUnmount;
+    this.tbody = this.container.tagName === 'TBODY';
     this.virtualScroller = new _VirtualScroller["default"](function () {
       return _this.container;
     }, _items, _objectSpread({}, restOptions, {
+      tbody: this.tbody,
       onStateChange: this.onStateChange
@@ -130,0 +139,0 @@ })); // `onMount()` option is deprecated due to no longer being used.

commonjs/ItemHeights.js

@@ -115,3 +115,3 @@ "use strict";
           if (window.VirtualScrollerDebug) {
-            (0, _log["default"])('Item spacing', spacing);
+            (0, _log["default"])('Measure item spacing', spacing);
           }
@@ -118,0 +118,0 @@

commonjs/ReactVirtualScroller.js

@@ -115,2 +115,3 @@ "use strict";
     var _this$props = _this.props,
+        AsComponent = _this$props.as,
         items = _this$props.items,
@@ -137,2 +138,3 @@ initialState = _this$props.initialState,
       measureItemsBatchSize: measureItemsBatchSize,
+      tbody: AsComponent === 'tbody',
       state: initialState,
@@ -356,3 +358,4 @@ customState: initialCustomState,
           onMount = _this$props3.onMount,
-          rest = _objectWithoutProperties(_this$props3, ["as", "itemComponent", "itemComponentProps", "items", "estimatedItemHeight", "bypass", "preserveScrollPositionOnPrependItems", "preserveScrollPosition", "preserveScrollPositionAtBottomOnMount", "shouldUpdateLayoutOnWindowResize", "measureItemsBatchSize", "initialState", "initialCustomState", "onStateChange", "onItemFirstRender", "onMount"]);
+          className = _this$props3.className,
+          rest = _objectWithoutProperties(_this$props3, ["as", "itemComponent", "itemComponentProps", "items", "estimatedItemHeight", "bypass", "preserveScrollPositionOnPrependItems", "preserveScrollPosition", "preserveScrollPositionAtBottomOnMount", "shouldUpdateLayoutOnWindowResize", "measureItemsBatchSize", "initialState", "initialCustomState", "onStateChange", "onItemFirstRender", "onMount", "className"]);
 
@@ -441,7 +444,9 @@ var _this$virtualScroller = this.virtualScroller.getState(),
 
+      var tbody = this.virtualScroller.tbody;
       return _react["default"].createElement(AsComponent, _extends({}, rest, {
         ref: this.container,
+        className: tbody ? className ? className + ' ' + 'VirtualScroller' : 'VirtualScroller' : className,
         style: {
-          paddingTop: (0, _utility.px)(beforeItemsHeight),
-          paddingBottom: (0, _utility.px)(afterItemsHeight)
+          paddingTop: tbody ? undefined : (0, _utility.px)(beforeItemsHeight),
+          paddingBottom: tbody ? undefined : (0, _utility.px)(afterItemsHeight)
         }
@@ -491,2 +496,3 @@ }), items.map(function (item, i) {
   measureItemsBatchSize: _propTypes["default"].number,
+  className: _propTypes["default"].string,
   onMount: _propTypes["default"].func,
@@ -493,0 +499,0 @@ onItemFirstRender: _propTypes["default"].func,

commonjs/VirtualScroller.js

@@ -19,2 +19,4 @@ "use strict";
 
+var _tbody = require("./tbody");
+
 function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; return newObj; } }
@@ -128,3 +130,3 @@
       (0, _log["default"])('Before items height', beforeItemsHeight);
-      (0, _log["default"])('After items height', afterItemsHeight);
+      (0, _log["default"])('After items height (actual or estimated)', afterItemsHeight);
       (0, _log["default"])('Average item height (calculated on previous render)', _this.itemHeights.getAverage());
@@ -138,3 +140,3 @@
       if (redoLayoutAfterRender) {
-        (0, _log["default"])('Redo layout after render');
+        (0, _log["default"])('Schedule a re-layout after the upcoming rerender');
       } // The page could be scrolled up, to any scroll position,
@@ -277,3 +279,3 @@ // for example, via "Home" key, resulting in `lastShownItemIndex`
 
-      (0, _log["default"])("~ Update layout (".concat(reason, ") ~"));
+      (0, _log["default"])("~ Update layout (on ".concat(reason, ") ~"));
       _this.isUpdatingItemIndexes = true;
@@ -298,2 +300,3 @@
         measureItemsBatchSize = options.measureItemsBatchSize,
+        tbody = options.tbody,
         bypass = options.bypass;
@@ -333,4 +336,10 @@ var estimatedItemHeight = options.estimatedItemHeight,
     this._shouldUpdateLayoutOnWindowResize = shouldUpdateLayoutOnWindowResize;
-    this.measureItemsBatchSize = measureItemsBatchSize === undefined ? 50 : measureItemsBatchSize;
+    this.measureItemsBatchSize = measureItemsBatchSize === undefined ? 50 : measureItemsBatchSize; // Work around `<tbody/>` not being able to have `padding`.
+    // https://gitlab.com/catamphetamine/virtual-scroller/-/issues/1
 
+    if (tbody) {
+      (0, _log["default"])('~ <tbody/> detected ~');
+      this.tbody = true;
+    }
+
     if (onItemFirstRender) {
@@ -414,3 +423,3 @@ this.onItemFirstRender = onItemFirstRender;
 
-      (0, _log["default"])('Initial state (created)', state);
+      (0, _log["default"])('Initial state (autogenerated)', state);
       (0, _log["default"])('First shown item index', state.firstShownItemIndex);
@@ -478,3 +487,3 @@ (0, _log["default"])('Last shown item index', state.lastShownItemIndex);
       if (typeof window !== 'undefined') {
-        return this.getEstimatedItemsCount(window.innerHeight);
+        return this.getEstimatedItemsCount(this.getMargin() * 2 + window.innerHeight);
       } else {
@@ -558,4 +567,7 @@ return 1;
     value: function onMount() {
+      // `this.isMounted = true` should be the first statement in this function,
+      // because otherwise `DOMVirtualScroller` would enter an infinite re-render loop
+      // if `this.onInitialRender('mount')` is called before setting `this.isMounted` to `true`.
+      this.isMounted = true;
       this.onInitialRender('mount');
-      this.isMounted = true;
       this.screenWidth = (0, _DOM.getScreenWidth)();
@@ -570,2 +582,9 @@ this.screenHeight = (0, _DOM.getScreenHeight)();
         window.addEventListener('resize', this.onResize);
+      } // Work around `<tbody/>` not being able to have `padding`.
+      // https://gitlab.com/catamphetamine/virtual-scroller/-/issues/1
+
+
+      if (this.tbody) {
+        (0, _tbody.addTbodyStyles)(this.getContainerNode());
+        this.updateTbodyPadding();
       }
@@ -578,4 +597,5 @@ }
           firstShownItemIndex = _this$getState2.firstShownItemIndex,
-          lastShownItemIndex = _this$getState2.lastShownItemIndex; // If there're any items.
+          lastShownItemIndex = _this$getState2.lastShownItemIndex;
 
+      (0, _log["default"])('~ Rendered (initial) ~'); // If there're any items.
 
@@ -658,4 +678,5 @@ if (this.getItemsCount() > 0) {
           firstShownItemIndex = _this$getState3.firstShownItemIndex,
-          lastShownItemIndex = _this$getState3.lastShownItemIndex; // If new items are shown (or older items are hidden).
+          lastShownItemIndex = _this$getState3.lastShownItemIndex;
 
+      (0, _log["default"])('~ Rendered ~'); // If new items are shown (or older items are hidden).
 
@@ -671,12 +692,31 @@ if (firstShownItemIndex !== prevState.firstShownItemIndex || lastShownItemIndex !== prevState.lastShownItemIndex || items !== prevState.items) {
         // }
+
+        if (this.tbody) {
+          this.updateTbodyPadding();
+        }
       }
     }
+    /**
+     * Is part of a workaround for `<tbody/>` not being able to have `padding`.
+     * https://gitlab.com/catamphetamine/virtual-scroller/-/issues/1
+     * CSS variables aren't supported in Internet Explorer.
+     */
+
   }, {
+    key: "updateTbodyPadding",
+    value: function updateTbodyPadding() {
+      var _this$getState4 = this.getState(),
+          beforeItemsHeight = _this$getState4.beforeItemsHeight,
+          afterItemsHeight = _this$getState4.afterItemsHeight;
+
+      (0, _tbody.setTbodyPadding)(this.getContainerNode(), beforeItemsHeight, afterItemsHeight);
+    }
+  }, {
     key: "updateItemHeights",
     value: function updateItemHeights(fromIndex, toIndex) {
-      var _this$getState4 = this.getState(),
-          firstShownItemIndex = _this$getState4.firstShownItemIndex;
+      var _this$getState5 = this.getState(),
+          firstShownItemIndex = _this$getState5.firstShownItemIndex;
 
       if (fromIndex !== undefined) {
-        (0, _log["default"])('~ Measure item heights after layout ~');
+        (0, _log["default"])('~ Measure item heights ~');
         this.itemHeights.update(fromIndex, toIndex, firstShownItemIndex);
@@ -692,4 +732,4 @@
     value: function updateItemHeight(i) {
-      var _this$getState5 = this.getState(),
-          firstShownItemIndex = _this$getState5.firstShownItemIndex;
+      var _this$getState6 = this.getState(),
+          firstShownItemIndex = _this$getState6.firstShownItemIndex;
 
@@ -713,4 +753,4 @@ this.itemHeights.updateItemHeight(i, firstShownItemIndex);
     value: function onItemHeightChange(i) {
-      var _this$getState6 = this.getState(),
-          itemHeights = _this$getState6.itemHeights;
+      var _this$getState7 = this.getState(),
+          itemHeights = _this$getState7.itemHeights;
 
@@ -776,3 +816,3 @@ var previousHeight = itemHeights[i];
         if (height === undefined) {
-          (0, _log["default"])("Item ".concat(i, " height hasn't been measured yet: render and redo layout"));
+          (0, _log["default"])("Item index ".concat(i, " lies within the visible area or its \"margins\", but its height hasn't been measured yet. Mark the item as \"shown\", render the list, measure the item's height and redo the layout."));
           firstNonMeasuredItemIndex = i;
@@ -1197,14 +1237,14 @@
       // * @param  {object} [newCustomState] — If `customState` was passed to `getInitialState()`, this `newCustomState` updates it.
-      var _this$getState7 = this.getState(),
-          previousItems = _this$getState7.items;
-
       var _this$getState8 = this.getState(),
-          firstShownItemIndex = _this$getState8.firstShownItemIndex,
-          lastShownItemIndex = _this$getState8.lastShownItemIndex,
-          beforeItemsHeight = _this$getState8.beforeItemsHeight,
-          afterItemsHeight = _this$getState8.afterItemsHeight,
-          itemStates = _this$getState8.itemStates,
-          itemHeights = _this$getState8.itemHeights,
-          itemSpacing = _this$getState8.itemSpacing;
+          previousItems = _this$getState8.items;
 
+      var _this$getState9 = this.getState(),
+          firstShownItemIndex = _this$getState9.firstShownItemIndex,
+          lastShownItemIndex = _this$getState9.lastShownItemIndex,
+          beforeItemsHeight = _this$getState9.beforeItemsHeight,
+          afterItemsHeight = _this$getState9.afterItemsHeight,
+          itemStates = _this$getState9.itemStates,
+          itemHeights = _this$getState9.itemHeights,
+          itemSpacing = _this$getState9.itemSpacing;
+
       (0, _log["default"])('~ Update items ~');
@@ -1291,3 +1331,3 @@
       (0, _log["default"])('Before items height', beforeItemsHeight);
-      (0, _log["default"])('After items height', afterItemsHeight); // Optionally preload items to be rendered.
+      (0, _log["default"])('After items height (actual or estimated)', afterItemsHeight); // Optionally preload items to be rendered.
 
@@ -1294,0 +1334,0 @@ this.onBeforeShowItems(firstShownItemIndex, lastShownItemIndex); // Render.

modules/DOM.js

@@ -36,15 +36,70 @@ /**
   }
-}
+} // export function getScreenWidth() {
+// 	// Doesn't correctly reflect page zoom in iOS Safari.
+// 	// (doesn't scale screen width accordingly).
+// 	// (but does reflect page zoom in desktop Chrome).
+// 	return document.documentElement.clientWidth
+// }
+// https://javascript.info/size-and-scroll-window
+// `<!DOCTYPE html>` may be required in order for this to work correctly.
+// Includes scrollbar (if any).
+
+export function getScreenWidth() {
+  // Correctly reflects page zoom in iOS Safari.
+  // (scales screen width accordingly).
+  // But, includes scrollbar (if any).
+  return window.innerWidth;
+} // export function getScreenHeight() {
+// 	// Doesn't support iOS Safari's dynamically shown/hidden
+// 	// top URL bar and bottom actions bar.
+// 	// https://codesandbox.io/s/elegant-fog-iddrh
+// 	// Tested in IE 11.
+// 	// It also doesn't correctly reflect page zoom in iOS Safari.
+// 	// (doesn't scale screen height accordingly).
+// 	// (but does reflect page zoom in desktop Chrome).
+// 	return document.documentElement.clientHeight
+// }
+// https://javascript.info/size-and-scroll-window
+// `<!DOCTYPE html>` is required in order for this to work correctly.
+// Without it, the returned height would be the height of the entire document.
+// Includes scrollbar (if any).
+
 export function getScreenHeight() {
+  // This variant of `getScreenHeight()`
+  // supports iOS Safari's dynamically shown/hidden
+  // top URL bar and bottom actions bar.
+  // https://codesandbox.io/s/elegant-fog-iddrh
+  // Tested in IE 11.
+  // It also correctly reflects page zoom in iOS Safari.
+  // (scales screen height accordingly).
+  // But, includes scrollbar (if any).
   return window.innerHeight;
-}
-export function getScreenWidth() {
-  return window.innerWidth;
-}
+} // // This variant of `getScreenHeight()`
+// // supports iOS Safari's dynamically shown/hidden
+// // top URL bar and bottom actions bar.
+// // https://codesandbox.io/s/elegant-fog-iddrh
+// // Tested in IE 11.
+// // It doesn't correctly reflect page zoom in iOS Safari.
+// // (doesn't scale screen height accordingly).
+// // (but does reflect page zoom in desktop Chrome).
+// function getScreenHeight() {
+// 	const div = document.createElement('div')
+// 	div.style.position = 'fixed'
+// 	div.style.left = 0
+// 	div.style.top = 0
+// 	div.style.right = 0
+// 	div.style.bottom = 0
+// 	div.style.zIndex = -1
+// 	document.body.appendChild(div)
+// 	const height = div.clientHeight
+// 	document.body.removeChild(div)
+// 	return height
+// }
+
 export function getScreenBounds() {
   var height = getScreenHeight();
   return {
-    // The first pixel of the viewport.
+    // The first pixel of the screen.
     top: getScrollY(),
-    // The pixel after the last pixel of the viewport.
+    // The pixel after the last pixel of the screen.
     bottom: getScrollY() + height,
@@ -51,0 +106,0 @@ height: height

modules/DOMVirtualScroller.js

@@ -38,10 +38,17 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }
       log('New state', state); // Set container padding top and bottom.
+      // Work around `<tbody/>` not being able to have `padding`.
+      // https://gitlab.com/catamphetamine/virtual-scroller/-/issues/1
+      // `this.virtualScroller` hasn't been initialized yet at this stage,
+      // so using `this.tbody` instead of `this.virtualScroller.tbody`.
 
-      _this.container.style.paddingTop = px(beforeItemsHeight);
-      _this.container.style.paddingBottom = px(afterItemsHeight); // Perform an intelligent "diff" re-render if the `items` are the same.
+      if (!_this.tbody) {
+        _this.container.style.paddingTop = px(beforeItemsHeight);
+        _this.container.style.paddingBottom = px(afterItemsHeight);
+      } // Perform an intelligent "diff" re-render if the `items` are the same.
 
+
       var diffRender = prevState && items === prevState.items && prevState.items.length > 0; // Remove no longer visible items from the DOM.
 
       if (diffRender) {
-        log('Incremental render'); // Decrement instead of increment here because
+        log('Incremental rerender'); // Decrement instead of increment here because
         // `this.container.removeChild()` changes indexes.
@@ -54,3 +61,3 @@
           } else {
-            log('Remove item', _i); // The item is no longer visible so remove it from the DOM.
+            log('Remove item index', _i); // The item is no longer visible so remove it from the DOM.
 
@@ -63,3 +70,3 @@ _this.unmountItem(_this.container.childNodes[_i - prevState.firstShownItemIndex]);
       } else {
-        log('Clean render');
+        log('Rerender from scratch');
 
@@ -87,7 +94,7 @@ while (_this.container.firstChild) {
           if (shouldPrependItems) {
-            log('Prepend item', i); // Append `item` to `this.container` before the retained items.
+            log('Prepend item index', i); // Append `item` to `this.container` before the retained items.
 
             _this.container.insertBefore(item, prependBeforeItemElement);
           } else {
-            log('Append item', i); // Append `item` to `this.container`.
+            log('Append item index', i); // Append `item` to `this.container`.
 
@@ -114,5 +121,7 @@ _this.container.appendChild(item);
     this.onItemUnmount = onItemUnmount;
+    this.tbody = this.container.tagName === 'TBODY';
     this.virtualScroller = new VirtualScroller(function () {
       return _this.container;
     }, _items, _objectSpread({}, restOptions, {
+      tbody: this.tbody,
       onStateChange: this.onStateChange
@@ -119,0 +128,0 @@ })); // `onMount()` option is deprecated due to no longer being used.

modules/ItemHeights.js

@@ -106,3 +106,3 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
           if (window.VirtualScrollerDebug) {
-            log('Item spacing', spacing);
+            log('Measure item spacing', spacing);
           }
@@ -109,0 +109,0 @@

modules/ReactVirtualScroller.js

@@ -99,2 +99,3 @@ function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
     var _this$props = _this.props,
+        AsComponent = _this$props.as,
         items = _this$props.items,
@@ -121,2 +122,3 @@ initialState = _this$props.initialState,
       measureItemsBatchSize: measureItemsBatchSize,
+      tbody: AsComponent === 'tbody',
       state: initialState,
@@ -340,3 +342,4 @@ customState: initialCustomState,
           onMount = _this$props3.onMount,
-          rest = _objectWithoutProperties(_this$props3, ["as", "itemComponent", "itemComponentProps", "items", "estimatedItemHeight", "bypass", "preserveScrollPositionOnPrependItems", "preserveScrollPosition", "preserveScrollPositionAtBottomOnMount", "shouldUpdateLayoutOnWindowResize", "measureItemsBatchSize", "initialState", "initialCustomState", "onStateChange", "onItemFirstRender", "onMount"]);
+          className = _this$props3.className,
+          rest = _objectWithoutProperties(_this$props3, ["as", "itemComponent", "itemComponentProps", "items", "estimatedItemHeight", "bypass", "preserveScrollPositionOnPrependItems", "preserveScrollPosition", "preserveScrollPositionAtBottomOnMount", "shouldUpdateLayoutOnWindowResize", "measureItemsBatchSize", "initialState", "initialCustomState", "onStateChange", "onItemFirstRender", "onMount", "className"]);
 
@@ -425,7 +428,9 @@ var _this$virtualScroller = this.virtualScroller.getState(),
 
+      var tbody = this.virtualScroller.tbody;
       return React.createElement(AsComponent, _extends({}, rest, {
         ref: this.container,
+        className: tbody ? className ? className + ' ' + 'VirtualScroller' : 'VirtualScroller' : className,
         style: {
-          paddingTop: px(beforeItemsHeight),
-          paddingBottom: px(afterItemsHeight)
+          paddingTop: tbody ? undefined : px(beforeItemsHeight),
+          paddingBottom: tbody ? undefined : px(afterItemsHeight)
         }
@@ -473,2 +478,3 @@ }), items.map(function (item, i) {
   measureItemsBatchSize: PropTypes.number,
+  className: PropTypes.string,
   onMount: PropTypes.func,
@@ -475,0 +481,0 @@ onItemFirstRender: PropTypes.func,

modules/VirtualScroller.js

@@ -16,2 +16,3 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }
 import { debounce } from './utility';
+import { addTbodyStyles, setTbodyPadding } from './tbody';
 var WATCH_CONTAINER_ELEMENT_TOP_COORDINATE_INTERVAL = 500;
@@ -111,3 +112,3 @@ var WATCH_CONTAINER_ELEMENT_TOP_COORDINATE_MAX_DURATION = 3000;
       log('Before items height', beforeItemsHeight);
-      log('After items height', afterItemsHeight);
+      log('After items height (actual or estimated)', afterItemsHeight);
       log('Average item height (calculated on previous render)', _this.itemHeights.getAverage());
@@ -121,3 +122,3 @@
       if (redoLayoutAfterRender) {
-        log('Redo layout after render');
+        log('Schedule a re-layout after the upcoming rerender');
       } // The page could be scrolled up, to any scroll position,
@@ -260,3 +261,3 @@ // for example, via "Home" key, resulting in `lastShownItemIndex`
 
-      log("~ Update layout (".concat(reason, ") ~"));
+      log("~ Update layout (on ".concat(reason, ") ~"));
       _this.isUpdatingItemIndexes = true;
@@ -281,2 +282,3 @@
         measureItemsBatchSize = options.measureItemsBatchSize,
+        tbody = options.tbody,
         bypass = options.bypass;
@@ -316,4 +318,10 @@ var estimatedItemHeight = options.estimatedItemHeight,
     this._shouldUpdateLayoutOnWindowResize = shouldUpdateLayoutOnWindowResize;
-    this.measureItemsBatchSize = measureItemsBatchSize === undefined ? 50 : measureItemsBatchSize;
+    this.measureItemsBatchSize = measureItemsBatchSize === undefined ? 50 : measureItemsBatchSize; // Work around `<tbody/>` not being able to have `padding`.
+    // https://gitlab.com/catamphetamine/virtual-scroller/-/issues/1
 
+    if (tbody) {
+      log('~ <tbody/> detected ~');
+      this.tbody = true;
+    }
+
     if (onItemFirstRender) {
@@ -397,3 +405,3 @@ this.onItemFirstRender = onItemFirstRender;
 
-      log('Initial state (created)', state);
+      log('Initial state (autogenerated)', state);
       log('First shown item index', state.firstShownItemIndex);
@@ -461,3 +469,3 @@ log('Last shown item index', state.lastShownItemIndex);
       if (typeof window !== 'undefined') {
-        return this.getEstimatedItemsCount(window.innerHeight);
+        return this.getEstimatedItemsCount(this.getMargin() * 2 + window.innerHeight);
       } else {
@@ -541,4 +549,7 @@ return 1;
     value: function onMount() {
+      // `this.isMounted = true` should be the first statement in this function,
+      // because otherwise `DOMVirtualScroller` would enter an infinite re-render loop
+      // if `this.onInitialRender('mount')` is called before setting `this.isMounted` to `true`.
+      this.isMounted = true;
       this.onInitialRender('mount');
-      this.isMounted = true;
       this.screenWidth = getScreenWidth();
@@ -553,2 +564,9 @@ this.screenHeight = getScreenHeight();
         window.addEventListener('resize', this.onResize);
+      } // Work around `<tbody/>` not being able to have `padding`.
+      // https://gitlab.com/catamphetamine/virtual-scroller/-/issues/1
+
+
+      if (this.tbody) {
+        addTbodyStyles(this.getContainerNode());
+        this.updateTbodyPadding();
       }
@@ -561,4 +579,5 @@ }
           firstShownItemIndex = _this$getState2.firstShownItemIndex,
-          lastShownItemIndex = _this$getState2.lastShownItemIndex; // If there're any items.
+          lastShownItemIndex = _this$getState2.lastShownItemIndex;
 
+      log('~ Rendered (initial) ~'); // If there're any items.
 
@@ -641,4 +660,5 @@ if (this.getItemsCount() > 0) {
           firstShownItemIndex = _this$getState3.firstShownItemIndex,
-          lastShownItemIndex = _this$getState3.lastShownItemIndex; // If new items are shown (or older items are hidden).
+          lastShownItemIndex = _this$getState3.lastShownItemIndex;
 
+      log('~ Rendered ~'); // If new items are shown (or older items are hidden).
 
@@ -654,12 +674,31 @@ if (firstShownItemIndex !== prevState.firstShownItemIndex || lastShownItemIndex !== prevState.lastShownItemIndex || items !== prevState.items) {
         // }
+
+        if (this.tbody) {
+          this.updateTbodyPadding();
+        }
       }
     }
+    /**
+     * Is part of a workaround for `<tbody/>` not being able to have `padding`.
+     * https://gitlab.com/catamphetamine/virtual-scroller/-/issues/1
+     * CSS variables aren't supported in Internet Explorer.
+     */
+
   }, {
+    key: "updateTbodyPadding",
+    value: function updateTbodyPadding() {
+      var _this$getState4 = this.getState(),
+          beforeItemsHeight = _this$getState4.beforeItemsHeight,
+          afterItemsHeight = _this$getState4.afterItemsHeight;
+
+      setTbodyPadding(this.getContainerNode(), beforeItemsHeight, afterItemsHeight);
+    }
+  }, {
     key: "updateItemHeights",
     value: function updateItemHeights(fromIndex, toIndex) {
-      var _this$getState4 = this.getState(),
-          firstShownItemIndex = _this$getState4.firstShownItemIndex;
+      var _this$getState5 = this.getState(),
+          firstShownItemIndex = _this$getState5.firstShownItemIndex;
 
       if (fromIndex !== undefined) {
-        log('~ Measure item heights after layout ~');
+        log('~ Measure item heights ~');
         this.itemHeights.update(fromIndex, toIndex, firstShownItemIndex);
@@ -675,4 +714,4 @@
     value: function updateItemHeight(i) {
-      var _this$getState5 = this.getState(),
-          firstShownItemIndex = _this$getState5.firstShownItemIndex;
+      var _this$getState6 = this.getState(),
+          firstShownItemIndex = _this$getState6.firstShownItemIndex;
 
@@ -696,4 +735,4 @@ this.itemHeights.updateItemHeight(i, firstShownItemIndex);
     value: function onItemHeightChange(i) {
-      var _this$getState6 = this.getState(),
-          itemHeights = _this$getState6.itemHeights;
+      var _this$getState7 = this.getState(),
+          itemHeights = _this$getState7.itemHeights;
 
@@ -759,3 +798,3 @@ var previousHeight = itemHeights[i];
         if (height === undefined) {
-          log("Item ".concat(i, " height hasn't been measured yet: render and redo layout"));
+          log("Item index ".concat(i, " lies within the visible area or its \"margins\", but its height hasn't been measured yet. Mark the item as \"shown\", render the list, measure the item's height and redo the layout."));
           firstNonMeasuredItemIndex = i;
@@ -1180,14 +1219,14 @@
       // * @param  {object} [newCustomState] — If `customState` was passed to `getInitialState()`, this `newCustomState` updates it.
-      var _this$getState7 = this.getState(),
-          previousItems = _this$getState7.items;
-
       var _this$getState8 = this.getState(),
-          firstShownItemIndex = _this$getState8.firstShownItemIndex,
-          lastShownItemIndex = _this$getState8.lastShownItemIndex,
-          beforeItemsHeight = _this$getState8.beforeItemsHeight,
-          afterItemsHeight = _this$getState8.afterItemsHeight,
-          itemStates = _this$getState8.itemStates,
-          itemHeights = _this$getState8.itemHeights,
-          itemSpacing = _this$getState8.itemSpacing;
+          previousItems = _this$getState8.items;
 
+      var _this$getState9 = this.getState(),
+          firstShownItemIndex = _this$getState9.firstShownItemIndex,
+          lastShownItemIndex = _this$getState9.lastShownItemIndex,
+          beforeItemsHeight = _this$getState9.beforeItemsHeight,
+          afterItemsHeight = _this$getState9.afterItemsHeight,
+          itemStates = _this$getState9.itemStates,
+          itemHeights = _this$getState9.itemHeights,
+          itemSpacing = _this$getState9.itemSpacing;
+
       log('~ Update items ~');
@@ -1274,3 +1313,3 @@
       log('Before items height', beforeItemsHeight);
-      log('After items height', afterItemsHeight); // Optionally preload items to be rendered.
+      log('After items height (actual or estimated)', afterItemsHeight); // Optionally preload items to be rendered.
 
@@ -1277,0 +1316,0 @@ this.onBeforeShowItems(firstShownItemIndex, lastShownItemIndex); // Render.

package.json

 {
   "name": "virtual-scroller",
-  "version": "1.2.0",
+  "version": "1.2.1",
   "description": "A component for efficiently rendering large lists of variable height items",
@@ -5,0 +5,0 @@ "main": "index.commonjs.js",

README.md

@@ -41,2 +41,6 @@ # VirtualScroller
 
+## GitHub Ban
+
+On March 9th, 2020, GitHub, Inc. silently [banned](https://medium.com/@catamphetamine/how-github-blocked-me-and-all-my-libraries-c32c61f061d3) my account (and all my libraries) without any notice for an unknown reason. I opened a support ticked but they didn't answer. Because of that, I had to move all my libraries to [GitLab](https://gitlab.com/catamphetamine).
+
 ## Install
@@ -89,3 +93,3 @@
 * `onMount()` — Should be called when the `VirtualScroller` component is "mounted" (rendered) on a page.
-* `onUpdate()` — Is only used when `getState()` and `setState()` are supplied: should be called after `setState()` updates the page. Is used for React `VirtualScroller` component implementation.
+* `onUpdate(prevState: object)` — Is only used when `getState()` and `setState(newState)` options are passed, in which case `onUpdate(prevState)` should be called after a `setState(newState)` call has caused a re-render. Is currently only used for React `VirtualScroller` component implementation, so it could be considered an internal implementation detail.
 * `onUnmount()` — Should be called when the `VirtualScroller` component is "unmounted" (removed) from the page.
@@ -92,0 +96,0 @@ * `getState(): object` — Returns `VirtualScroller` state. Is used for React `VirtualScroller` component implementation.

source/DOM.js

@@ -45,16 +45,74 @@ /**
 
-export function getScreenHeight() {
-	return window.innerHeight
-}
+// export function getScreenWidth() {
+// 	// Doesn't correctly reflect page zoom in iOS Safari.
+// 	// (doesn't scale screen width accordingly).
+// 	// (but does reflect page zoom in desktop Chrome).
+// 	return document.documentElement.clientWidth
+// }
 
+// https://javascript.info/size-and-scroll-window
+// `<!DOCTYPE html>` may be required in order for this to work correctly.
+// Includes scrollbar (if any).
 export function getScreenWidth() {
+	// Correctly reflects page zoom in iOS Safari.
+	// (scales screen width accordingly).
+	// But, includes scrollbar (if any).
 	return window.innerWidth
 }
 
+// export function getScreenHeight() {
+// 	// Doesn't support iOS Safari's dynamically shown/hidden
+// 	// top URL bar and bottom actions bar.
+// 	// https://codesandbox.io/s/elegant-fog-iddrh
+// 	// Tested in IE 11.
+// 	// It also doesn't correctly reflect page zoom in iOS Safari.
+// 	// (doesn't scale screen height accordingly).
+// 	// (but does reflect page zoom in desktop Chrome).
+// 	return document.documentElement.clientHeight
+// }
+
+// https://javascript.info/size-and-scroll-window
+// `<!DOCTYPE html>` is required in order for this to work correctly.
+// Without it, the returned height would be the height of the entire document.
+// Includes scrollbar (if any).
+export function getScreenHeight() {
+	// This variant of `getScreenHeight()`
+	// supports iOS Safari's dynamically shown/hidden
+	// top URL bar and bottom actions bar.
+	// https://codesandbox.io/s/elegant-fog-iddrh
+	// Tested in IE 11.
+	// It also correctly reflects page zoom in iOS Safari.
+	// (scales screen height accordingly).
+	// But, includes scrollbar (if any).
+	return window.innerHeight
+}
+
+// // This variant of `getScreenHeight()`
+// // supports iOS Safari's dynamically shown/hidden
+// // top URL bar and bottom actions bar.
+// // https://codesandbox.io/s/elegant-fog-iddrh
+// // Tested in IE 11.
+// // It doesn't correctly reflect page zoom in iOS Safari.
+// // (doesn't scale screen height accordingly).
+// // (but does reflect page zoom in desktop Chrome).
+// function getScreenHeight() {
+// 	const div = document.createElement('div')
+// 	div.style.position = 'fixed'
+// 	div.style.left = 0
+// 	div.style.top = 0
+// 	div.style.right = 0
+// 	div.style.bottom = 0
+// 	div.style.zIndex = -1
+// 	document.body.appendChild(div)
+// 	const height = div.clientHeight
+// 	document.body.removeChild(div)
+// 	return height
+// }
+
 export function getScreenBounds() {
 	const height = getScreenHeight()
 	return {
-		// The first pixel of the viewport.
+		// The first pixel of the screen.
 		top: getScrollY(),
-		// The pixel after the last pixel of the viewport.
+		// The pixel after the last pixel of the screen.
 		bottom: getScrollY() + height,
@@ -61,0 +119,0 @@ height

source/DOMVirtualScroller.js

@@ -15,2 +15,3 @@ import VirtualScroller from './VirtualScroller'
     this.onItemUnmount = onItemUnmount
+    this.tbody = this.container.tagName === 'TBODY'
     this.virtualScroller = new VirtualScroller(
@@ -21,2 +22,3 @@ () => this.container,
         ...restOptions,
+        tbody: this.tbody,
         onStateChange: this.onStateChange
@@ -45,4 +47,10 @@ }
     // Set container padding top and bottom.
-    this.container.style.paddingTop = px(beforeItemsHeight)
-    this.container.style.paddingBottom = px(afterItemsHeight)
+    // Work around `<tbody/>` not being able to have `padding`.
+    // https://gitlab.com/catamphetamine/virtual-scroller/-/issues/1
+    // `this.virtualScroller` hasn't been initialized yet at this stage,
+    // so using `this.tbody` instead of `this.virtualScroller.tbody`.
+    if (!this.tbody) {
+      this.container.style.paddingTop = px(beforeItemsHeight)
+      this.container.style.paddingBottom = px(afterItemsHeight)
+    }
     // Perform an intelligent "diff" re-render if the `items` are the same.
@@ -52,3 +60,3 @@ const diffRender = prevState && items === prevState.items && prevState.items.length > 0
     if (diffRender) {
-      log('Incremental render')
+      log('Incremental rerender')
       // Decrement instead of increment here because
@@ -61,3 +69,3 @@ // `this.container.removeChild()` changes indexes.
         } else {
-          log('Remove item', i)
+          log('Remove item index', i)
           // The item is no longer visible so remove it from the DOM.
@@ -69,3 +77,3 @@ this.unmountItem(this.container.childNodes[i - prevState.firstShownItemIndex])
     } else {
-      log('Clean render')
+      log('Rerender from scratch')
       while (this.container.firstChild) {
@@ -89,7 +97,7 @@ this.unmountItem(this.container.firstChild)
         if (shouldPrependItems) {
-          log('Prepend item', i)
+          log('Prepend item index', i)
           // Append `item` to `this.container` before the retained items.
           this.container.insertBefore(item, prependBeforeItemElement)
         } else {
-          log('Append item', i)
+          log('Append item index', i)
           // Append `item` to `this.container`.
@@ -96,0 +104,0 @@ this.container.appendChild(item)

source/ItemHeights.js

@@ -86,3 +86,3 @@ import log from './log'
 				if (window.VirtualScrollerDebug) {
-					log('Item spacing', spacing)
+					log('Measure item spacing', spacing)
 				}
@@ -89,0 +89,0 @@ return spacing

source/ReactVirtualScroller.js

@@ -32,2 +32,3 @@ import React from 'react'
 		measureItemsBatchSize: PropTypes.number,
+		className: PropTypes.string,
 		onMount: PropTypes.func,
@@ -82,2 +83,3 @@ onItemFirstRender: PropTypes.func,
 		const {
+			as: AsComponent,
 			items,
@@ -107,2 +109,3 @@ initialState,
 				measureItemsBatchSize,
+				tbody: AsComponent === 'tbody',
 				state: initialState,
@@ -323,2 +326,3 @@ customState: initialCustomState,
 			onMount,
+			className,
 			...rest
@@ -407,2 +411,3 @@ } = this.props
 		}
+		const tbody = this.virtualScroller.tbody
 		return (
@@ -412,5 +417,6 @@ <AsComponent
 				ref={this.container}
+				className={tbody ? (className ? className + ' ' + 'VirtualScroller' : 'VirtualScroller') : className}
 				style={{
-					paddingTop: px(beforeItemsHeight),
-					paddingBottom: px(afterItemsHeight)
+					paddingTop: tbody ? undefined : px(beforeItemsHeight),
+					paddingBottom: tbody ? undefined : px(afterItemsHeight)
 				}}>
@@ -417,0 +423,0 @@ {items.map((item, i) => {

source/VirtualScroller.js

@@ -13,2 +13,3 @@ import shallowEqual from './shallowEqual'
 import { debounce } from './utility'
+import { addTbodyStyles, setTbodyPadding } from './tbody'
 
@@ -39,2 +40,3 @@ const WATCH_CONTAINER_ELEMENT_TOP_COORDINATE_INTERVAL = 500
 			measureItemsBatchSize,
+			tbody,
 			bypass,
@@ -89,2 +91,9 @@ // bypassBatchSize
 
+		// Work around `<tbody/>` not being able to have `padding`.
+		// https://gitlab.com/catamphetamine/virtual-scroller/-/issues/1
+		if (tbody) {
+			log('~ <tbody/> detected ~')
+			this.tbody = true
+		}
+
 		if (onItemFirstRender) {
@@ -162,3 +171,3 @@ this.onItemFirstRender = onItemFirstRender
 		}
-		log('Initial state (created)', state)
+		log('Initial state (autogenerated)', state)
 		log('First shown item index', state.firstShownItemIndex)
@@ -218,3 +227,3 @@ log('Last shown item index', state.lastShownItemIndex)
 		if (typeof window !== 'undefined') {
-			return this.getEstimatedItemsCount(window.innerHeight)
+			return this.getEstimatedItemsCount(this.getMargin() * 2 + window.innerHeight)
 		} else {
@@ -286,4 +295,7 @@ return 1
 	onMount() {
+		// `this.isMounted = true` should be the first statement in this function,
+		// because otherwise `DOMVirtualScroller` would enter an infinite re-render loop
+		// if `this.onInitialRender('mount')` is called before setting `this.isMounted` to `true`.
+		this.isMounted = true
 		this.onInitialRender('mount')
-		this.isMounted = true
 		this.screenWidth = getScreenWidth()
@@ -298,2 +310,8 @@ this.screenHeight = getScreenHeight()
 		}
+		// Work around `<tbody/>` not being able to have `padding`.
+		// https://gitlab.com/catamphetamine/virtual-scroller/-/issues/1
+		if (this.tbody) {
+			addTbodyStyles(this.getContainerNode())
+			this.updateTbodyPadding()
+		}
 	}
@@ -306,2 +324,3 @@
 		} = this.getState()
+		log('~ Rendered (initial) ~')
 		// If there're any items.
@@ -414,2 +433,3 @@ if (this.getItemsCount() > 0) {
 		} = this.getState()
+		log('~ Rendered ~')
 		// If new items are shown (or older items are hidden).
@@ -431,5 +451,18 @@ if (firstShownItemIndex !== prevState.firstShownItemIndex ||
 			// }
+			if (this.tbody) {
+				this.updateTbodyPadding()
+			}
 		}
 	}
 
+  /**
+   * Is part of a workaround for `<tbody/>` not being able to have `padding`.
+   * https://gitlab.com/catamphetamine/virtual-scroller/-/issues/1
+   * CSS variables aren't supported in Internet Explorer.
+   */
+	updateTbodyPadding() {
+		const { beforeItemsHeight, afterItemsHeight } = this.getState()
+		setTbodyPadding(this.getContainerNode(), beforeItemsHeight, afterItemsHeight)
+	}
+
 	updateItemHeights(fromIndex, toIndex) {
@@ -440,3 +473,3 @@ const {
 		if (fromIndex !== undefined) {
-			log('~ Measure item heights after layout ~')
+			log('~ Measure item heights ~')
 			this.itemHeights.update(
@@ -518,3 +551,3 @@ fromIndex,
 			if (height === undefined) {
-				log(`Item ${i} height hasn't been measured yet: render and redo layout`)
+				log(`Item index ${i} lies within the visible area or its "margins", but its height hasn't been measured yet. Mark the item as "shown", render the list, measure the item's height and redo the layout.`)
 				firstNonMeasuredItemIndex = i
@@ -839,3 +872,3 @@ if (firstShownItemIndex === undefined) {
 		log('Before items height', beforeItemsHeight)
-		log('After items height', afterItemsHeight)
+		log('After items height (actual or estimated)', afterItemsHeight)
 		log('Average item height (calculated on previous render)', this.itemHeights.getAverage())
@@ -847,3 +880,3 @@ if (isDebug()) {
 		if (redoLayoutAfterRender) {
-			log('Redo layout after render')
+			log('Schedule a re-layout after the upcoming rerender')
 		}
@@ -1044,3 +1077,3 @@ // The page could be scrolled up, to any scroll position,
 		// Re-render the list.
-		log(`~ Update layout (${reason}) ~`)
+		log(`~ Update layout (on ${reason}) ~`)
 		this.isUpdatingItemIndexes = true
@@ -1158,3 +1191,3 @@ this.updateShownItemIndexesRecursive()
 		log('Before items height', beforeItemsHeight)
-		log('After items height', afterItemsHeight)
+		log('After items height (actual or estimated)', afterItemsHeight)
 		// Optionally preload items to be rendered.
@@ -1161,0 +1194,0 @@ this.onBeforeShowItems(firstShownItemIndex, lastShownItemIndex)

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

1199217

increased by6.1%

Number of package files

72

increased by9.09%

Lines of code

7609

increased by5.59%

Number of lines in readme file

396

increased by1.02%

No dependency changes