react-easy-infinite-scroll-hook
Advanced tools
Comparing version 1.8.6 to 1.8.7
@@ -1,2 +0,2 @@ | ||
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t,e,o=require("react");function l(t,e,o,l){return new(o||(o=Promise))((function(i,n){function r(t){try{c(l.next(t))}catch(t){n(t)}}function s(t){try{c(l.throw(t))}catch(t){n(t)}}function c(t){var e;t.done?i(t.value):(e=t.value,e instanceof o?e:new o((function(t){t(e)}))).then(r,s)}c((l=l.apply(t,e||[])).next())}))}exports.ScrollAxisName=void 0,(t=exports.ScrollAxisName||(exports.ScrollAxisName={})).VERTICAL="vertical",t.HORIZONTAL="horizontal",exports.ScrollDirection=void 0,(e=exports.ScrollDirection||(exports.ScrollDirection={})).UP="up",e.DOWN="down",e.LEFT="left",e.RIGHT="right";class i{constructor(t){this._validateScrollValue=(t,e,o)=>{const l=t<0?-1:1;return Math.abs(t)>e?null!=o?o:e*l:t},this._scroll=function({scrollTop:t,scrollLeft:e}){var o;if(!(null===(o=this._scrollingContainerRef)||void 0===o?void 0:o.scrollingElement))return;const{scrollHeight:l,scrollWidth:i}=this._scrollingContainerRef.scrollingElement;void 0!==t&&(this._scrollingContainerRef.scrollingElement.scrollTop=this._validateScrollValue(t,l)),void 0!==e&&(this._scrollingContainerRef.scrollingElement.scrollLeft=this._validateScrollValue(e,i))},this._computeThreshold=function(){const{state:{clientWidth:t,clientHeight:e},props:{scrollThreshold:o=1},_scrollingContainerRef:l}=this;if(!(null==l?void 0:l.scrollingElement)||t===l.scrollingElement.clientWidth&&e===l.scrollingElement.clientHeight)return;const{clientWidth:i,clientHeight:n,scrollHeight:r,scrollWidth:s}=l.scrollingElement;let c={vertical:0,horizontal:0};if("string"==typeof o){const t=Math.abs(parseInt(o));c={vertical:this._validateScrollValue(t,r,n),horizontal:this._validateScrollValue(t,s,i)}}else{const t=o>1?1:o<=0?.1:o;c={vertical:t*n,horizontal:t*i}}this.state.computedScrollThreshold=c,this.state.clientWidth=i,this.state.clientHeight=n},this._getPossibleDirections=function(){this._computeThreshold();const{state:{clientHeight:t,clientWidth:e,computedScrollThreshold:{vertical:o,horizontal:l}},props:{reverse:i={}},_scrollingContainerRef:n}=this,{scrollHeight:r,scrollWidth:s,scrollLeft:c,scrollTop:h}=n.scrollingElement,{column:a,row:u}=i,d=(t,e)=>Math.abs(t)<=e,p=(t,e,o,l)=>Math.abs(t)>=Math.abs(e-o-l);return{[a?exports.ScrollDirection.DOWN:exports.ScrollDirection.UP]:d(h,o),[a?exports.ScrollDirection.UP:exports.ScrollDirection.DOWN]:p(h,r,t,o),[u?exports.ScrollDirection.RIGHT:exports.ScrollDirection.LEFT]:d(c,l),[u?exports.ScrollDirection.LEFT:exports.ScrollDirection.RIGHT]:p(c,s,e,l)}},this._loadByDirection=function(t,e,o){return l(this,void 0,void 0,(function*(){const{state:{isLoading:l,thresholdReached:i},props:{next:n,hasMore:r}}=this,s=t===exports.ScrollDirection.UP?exports.ScrollAxisName.VERTICAL:exports.ScrollAxisName.HORIZONTAL;if(!l){const l=r[t]&&!i[t]&&o[t],c=!l&&r[e]&&!i[e]&&o[e];if(l||c)try{const o=l?t:e;this.state.thresholdReached[o]=!0,this.state.isLoading=!0,yield n(o)}finally{setTimeout((()=>this._onLoadComplete(s)),0)}}}))},this._checkOffsetAndLoadMore=function(){const{_scrollingContainerRef:t}=this;if(!t)return;const e=this._getPossibleDirections(),o=t=>{!e[t]&&this.state.thresholdReached[t]&&(this.state.thresholdReached[t]=!1)};Object.values(exports.ScrollDirection).forEach((t=>o(t))),this._loadByDirection(exports.ScrollDirection.UP,exports.ScrollDirection.DOWN,e),this._loadByDirection(exports.ScrollDirection.LEFT,exports.ScrollDirection.RIGHT,e)},this._setRef=function(t){var e,o,l;const i={scrollingElement:null,registerEventListener:null};if(this.props.windowScroll)i.scrollingElement=document.scrollingElement,i.registerEventListener=document;else{const n=null!==(l=null!==(e=null==t?void 0:t._scrollingContainer)&&void 0!==e?e:null===(o=null==t?void 0:t.Grid)||void 0===o?void 0:o._scrollingContainer)&&void 0!==l?l:t;i.scrollingElement=n,i.registerEventListener=n}const{scrollingElement:n,registerEventListener:r}=i;if(n&&r&&("number"!=typeof n.scrollHeight||"number"!=typeof n.scrollWidth||"number"!=typeof n.scrollLeft||"number"!=typeof n.scrollTop||"number"!=typeof n.clientHeight||"number"!=typeof n.clientWidth||"function"!=typeof r.addEventListener||"function"!=typeof r.removeEventListener)||!n||!r)return void console.error("Sorry I can't use this container - try using a different DOM element.");this._scrollingContainerRef=i;const s=()=>{var t;if(!(null===(t=this._scrollingContainerRef)||void 0===t?void 0:t.scrollingElement))return;const{_scrollingContainerRef:{scrollingElement:e},props:{onScroll:o}}=this,{scrollHeight:l,scrollWidth:i,scrollLeft:n,scrollTop:r,clientHeight:s,clientWidth:c}=e;o&&o({clientHeight:s,clientWidth:c,scrollHeight:l,scrollWidth:i,scrollLeft:n,scrollTop:r}),this._checkOffsetAndLoadMore()};this.state.rowCount=this.props.rowCount,this.state.columnCount=this.props.columnCount,this.state.scrollHeight=this._scrollingContainerRef.scrollingElement.scrollHeight,this.state.scrollWidth=this._scrollingContainerRef.scrollingElement.scrollWidth;const{initialScroll:c}=this.props;c&&this._scroll({scrollTop:c.top,scrollLeft:c.left}),this._onCleanup(),this._scrollingContainerRef.registerEventListener.addEventListener("scroll",s),this.state.cleanup.push((()=>{var t,e;return null===(e=null===(t=this._scrollingContainerRef)||void 0===t?void 0:t.registerEventListener)||void 0===e?void 0:e.removeEventListener("scroll",s)})),this._checkOffsetAndLoadMore()},this._onLoadComplete=function(t){var e;if(!(null===(e=this._scrollingContainerRef)||void 0===e?void 0:e.scrollingElement))return;const o=t===exports.ScrollAxisName.VERTICAL,{state:{rowCount:l=0,columnCount:i=0,scrollHeight:n,scrollWidth:r},props:{rowCount:s=0,columnCount:c=0,reverse:h={}},_scrollingContainerRef:a}=this,{scrollTop:u,scrollLeft:d,scrollHeight:p,scrollWidth:f,clientHeight:g,clientWidth:v}=a.scrollingElement,m=o?s:c,C=o?u:d,_=o?p:f,E=o?n:r,L=o?g:v;if((o?l:i)!==m&&Math.abs(C)<L){const t=h[o?"column":"row"]?-1:1;this._scroll({["scroll"+(o?"Top":"Left")]:C+(_-E)*t})}this.state.isLoading=!1,this.state[o?"scrollHeight":"scrollWidth"]=_,this.state[o?"rowCount":"columnCount"]=m,setTimeout((()=>this._checkOffsetAndLoadMore()),100)},this._onPropsChange=function(t){this.props=t;const{state:{isLoading:e},props:{rowCount:o,columnCount:l,hasMore:i},_scrollingContainerRef:n}=this;n&&(void 0===o&&(i.down||i.up)&&console.warn(`You provided props with "hasMore: { up: ${!!i.up}, down: ${!!i.down} }" but "rowCount" is "undefined"`),void 0===l&&(i.left||i.right)&&console.warn(`You provided props with "hasMore: { left: ${!!i.left}, right: ${!!i.right} }" but "columnCount" is "undefined"`),e||this._checkOffsetAndLoadMore())},this._onCleanup=function(){const{state:{cleanup:t},_scrollingContainerRef:e}=this;(null==e?void 0:e.scrollingElement)&&"HTML"!==(null==e?void 0:e.scrollingElement.nodeName)||(t.forEach((t=>t())),this.state.cleanup=[])},this.setRef=this._setRef.bind(this),this.onPropsChange=this._onPropsChange.bind(this),this.onCleanup=this._onCleanup.bind(this),this.props=t,this.state={rowCount:t.rowCount,columnCount:t.columnCount,scrollHeight:0,scrollWidth:0,clientHeight:0,clientWidth:0,isLoading:!1,computedScrollThreshold:{vertical:0,horizontal:0},thresholdReached:{},cleanup:[]}}}const n=t=>{const{rowCount:e,columnCount:l,hasMore:{up:n,down:r,left:s,right:c},next:h,windowScroll:a}=t,{current:{setRef:u,onPropsChange:d,onCleanup:p}}=o.useRef(new i(t));return o.useLayoutEffect((()=>(a&&u(null),p)),[]),o.useEffect((()=>d(t)),[e,l,n,r,s,c,h]),{setRef:u}};exports.InfiniteScroll=i,exports.default=n,exports.useInfiniteScroll=n; | ||
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t,e,o=require("react");function l(t,e,o,l){return new(o||(o=Promise))((function(i,n){function r(t){try{c(l.next(t))}catch(t){n(t)}}function s(t){try{c(l.throw(t))}catch(t){n(t)}}function c(t){var e;t.done?i(t.value):(e=t.value,e instanceof o?e:new o((function(t){t(e)}))).then(r,s)}c((l=l.apply(t,e||[])).next())}))}exports.ScrollAxisName=void 0,(t=exports.ScrollAxisName||(exports.ScrollAxisName={})).VERTICAL="vertical",t.HORIZONTAL="horizontal",exports.ScrollDirection=void 0,(e=exports.ScrollDirection||(exports.ScrollDirection={})).UP="up",e.DOWN="down",e.LEFT="left",e.RIGHT="right";class i{constructor(t){this._validateScrollValue=(t,e,o)=>{const l=t<0?-1:1;return Math.abs(t)>e?null!=o?o:e*l:t},this._scroll=function({scrollTop:t,scrollLeft:e}){var o;if(!(null===(o=this._scrollingContainerRef)||void 0===o?void 0:o.scrollingElement))return;const{scrollHeight:l,scrollWidth:i}=this._scrollingContainerRef.scrollingElement;void 0!==t&&(this._scrollingContainerRef.scrollingElement.scrollTop=this._validateScrollValue(t,l)),void 0!==e&&(this._scrollingContainerRef.scrollingElement.scrollLeft=this._validateScrollValue(e,i))},this._computeThreshold=function(){const{state:{clientWidth:t,clientHeight:e},props:{scrollThreshold:o=1},_scrollingContainerRef:l}=this;if(!(null==l?void 0:l.scrollingElement)||t===l.scrollingElement.clientWidth&&e===l.scrollingElement.clientHeight)return;const{clientWidth:i,clientHeight:n,scrollHeight:r,scrollWidth:s}=l.scrollingElement;let c={vertical:0,horizontal:0};if("string"==typeof o){const t=Math.abs(parseInt(o));c={vertical:this._validateScrollValue(t,r,n),horizontal:this._validateScrollValue(t,s,i)}}else{const t=o>1?1:o<=0?.1:o;c={vertical:t*n,horizontal:t*i}}this.state.computedScrollThreshold=c,this.state.clientWidth=i,this.state.clientHeight=n},this._getPossibleDirections=function(){this._computeThreshold();const{state:{clientHeight:t,clientWidth:e,computedScrollThreshold:{vertical:o,horizontal:l}},props:{reverse:i={}},_scrollingContainerRef:n}=this,{scrollHeight:r,scrollWidth:s,scrollLeft:c,scrollTop:h}=n.scrollingElement,{column:a,row:u}=i,d=(t,e)=>Math.abs(t)<=e,p=(t,e,o,l)=>Math.abs(t)>=Math.abs(e-o-l);return{[a?exports.ScrollDirection.DOWN:exports.ScrollDirection.UP]:d(h,o),[a?exports.ScrollDirection.UP:exports.ScrollDirection.DOWN]:p(h,r,t,o),[u?exports.ScrollDirection.RIGHT:exports.ScrollDirection.LEFT]:d(c,l),[u?exports.ScrollDirection.LEFT:exports.ScrollDirection.RIGHT]:p(c,s,e,l)}},this._loadByDirection=function(t,e,o){return l(this,void 0,void 0,(function*(){const{state:{isLoading:l,thresholdReached:i},props:{next:n,hasMore:r}}=this,s=t===exports.ScrollDirection.UP?exports.ScrollAxisName.VERTICAL:exports.ScrollAxisName.HORIZONTAL;if(!l){const l=r[t]&&!i[t]&&o[t],c=!l&&r[e]&&!i[e]&&o[e];if(l||c)try{const o=l?t:e;this.state.thresholdReached[o]=!0,this.state.isLoading=!0,yield n(o)}finally{setTimeout((()=>this._onLoadComplete(s)),0)}}}))},this._checkOffsetAndLoadMore=function(){const{_scrollingContainerRef:t}=this;if(!t)return;const e=this._getPossibleDirections(),o=t=>{!e[t]&&this.state.thresholdReached[t]&&(this.state.thresholdReached[t]=!1)};Object.values(exports.ScrollDirection).forEach((t=>o(t))),this._loadByDirection(exports.ScrollDirection.UP,exports.ScrollDirection.DOWN,e),this._loadByDirection(exports.ScrollDirection.LEFT,exports.ScrollDirection.RIGHT,e)},this._setRef=function(t){var e,o,l;const i={scrollingElement:null,registerEventListener:null};if(this.props.windowScroll)i.scrollingElement=document.scrollingElement,i.registerEventListener=document;else{const n=null!==(l=null!==(e=null==t?void 0:t._scrollingContainer)&&void 0!==e?e:null===(o=null==t?void 0:t.Grid)||void 0===o?void 0:o._scrollingContainer)&&void 0!==l?l:t;i.scrollingElement=n,i.registerEventListener=n}const{scrollingElement:n,registerEventListener:r}=i;if(n&&r&&("number"!=typeof n.scrollHeight||"number"!=typeof n.scrollWidth||"number"!=typeof n.scrollLeft||"number"!=typeof n.scrollTop||"number"!=typeof n.clientHeight||"number"!=typeof n.clientWidth||"function"!=typeof r.addEventListener||"function"!=typeof r.removeEventListener)||!n||!r)return void console.error("Sorry I can't use this container - try using a different DOM element.");this._scrollingContainerRef=i;const s=()=>{var t;if(!(null===(t=this._scrollingContainerRef)||void 0===t?void 0:t.scrollingElement))return;const{_scrollingContainerRef:{scrollingElement:e},props:{onScroll:o}}=this,{scrollHeight:l,scrollWidth:i,scrollLeft:n,scrollTop:r,clientHeight:s,clientWidth:c}=e;o&&o({clientHeight:s,clientWidth:c,scrollHeight:l,scrollWidth:i,scrollLeft:n,scrollTop:r}),this._checkOffsetAndLoadMore()};this.state.rowCount=this.props.rowCount,this.state.columnCount=this.props.columnCount,this.state.scrollHeight=this._scrollingContainerRef.scrollingElement.scrollHeight,this.state.scrollWidth=this._scrollingContainerRef.scrollingElement.scrollWidth;const{initialScroll:c}=this.props;c&&this._scroll({scrollTop:c.top,scrollLeft:c.left}),this._onCleanup(),this._scrollingContainerRef.registerEventListener.addEventListener("scroll",s),this.state.cleanup.push((()=>{var t,e;return null===(e=null===(t=this._scrollingContainerRef)||void 0===t?void 0:t.registerEventListener)||void 0===e?void 0:e.removeEventListener("scroll",s)})),this._checkOffsetAndLoadMore()},this._onLoadComplete=function(t){var e;if(!(null===(e=this._scrollingContainerRef)||void 0===e?void 0:e.scrollingElement))return;const o=t===exports.ScrollAxisName.VERTICAL,{state:{rowCount:l=0,columnCount:i=0,scrollHeight:n,scrollWidth:r},props:{rowCount:s=0,columnCount:c=0,reverse:h={}},_scrollingContainerRef:a}=this,{scrollTop:u,scrollLeft:d,scrollHeight:p,scrollWidth:f,clientHeight:g,clientWidth:v}=a.scrollingElement,m=o?s:c,C=o?u:d,_=o?p:f,E=o?n:r,L=o?g:v;if((o?l:i)!==m&&Math.abs(C)<L){const t=h[o?"column":"row"]?-1:1;this._scroll({["scroll"+(o?"Top":"Left")]:C+(_-E)*t})}this.state.isLoading=!1,this.state[o?"scrollHeight":"scrollWidth"]=_,this.state[o?"rowCount":"columnCount"]=m,setTimeout((()=>this._checkOffsetAndLoadMore()),100)},this._onPropsChange=function(t){this.props=t;const{state:{isLoading:e},props:{rowCount:o,columnCount:l,hasMore:i},_scrollingContainerRef:n}=this;n&&(void 0===o&&(i.down||i.up)&&console.warn(`You provided props with "hasMore: { up: ${!!i.up}, down: ${!!i.down} }" but "rowCount" is "undefined"`),void 0===l&&(i.left||i.right)&&console.warn(`You provided props with "hasMore: { left: ${!!i.left}, right: ${!!i.right} }" but "columnCount" is "undefined"`),e||this._checkOffsetAndLoadMore())},this._onCleanup=function(){const{state:{cleanup:t}}=this;t.length&&(t.forEach((t=>t())),this.state.cleanup=[])},this.setRef=this._setRef.bind(this),this.onPropsChange=this._onPropsChange.bind(this),this.onCleanup=this._onCleanup.bind(this),this.props=t,this.state={rowCount:t.rowCount,columnCount:t.columnCount,scrollHeight:0,scrollWidth:0,clientHeight:0,clientWidth:0,isLoading:!1,computedScrollThreshold:{vertical:0,horizontal:0},thresholdReached:{},cleanup:[]}}}const n=t=>{const{rowCount:e,columnCount:l,hasMore:{up:n,down:r,left:s,right:c},next:h,windowScroll:a}=t,{current:{setRef:u,onPropsChange:d,onCleanup:p}}=o.useRef(new i(t));return o.useLayoutEffect((()=>(a&&u(null),a?p:void 0)),[]),o.useEffect((()=>d(t)),[e,l,n,r,s,c,h]),{setRef:u}};exports.InfiniteScroll=i,exports.default=n,exports.useInfiniteScroll=n; | ||
//# sourceMappingURL=index.js.map |
@@ -1,2 +0,2 @@ | ||
import{useRef as t,useLayoutEffect as e,useEffect as o}from"react";function n(t,e,o,n){return new(o||(o=Promise))((function(l,i){function s(t){try{c(n.next(t))}catch(t){i(t)}}function r(t){try{c(n.throw(t))}catch(t){i(t)}}function c(t){var e;t.done?l(t.value):(e=t.value,e instanceof o?e:new o((function(t){t(e)}))).then(s,r)}c((n=n.apply(t,e||[])).next())}))}var l,i;!function(t){t.VERTICAL="vertical",t.HORIZONTAL="horizontal"}(l||(l={})),function(t){t.UP="up",t.DOWN="down",t.LEFT="left",t.RIGHT="right"}(i||(i={}));class s{constructor(t){this._validateScrollValue=(t,e,o)=>{const n=t<0?-1:1;return Math.abs(t)>e?null!=o?o:e*n:t},this._scroll=function({scrollTop:t,scrollLeft:e}){var o;if(!(null===(o=this._scrollingContainerRef)||void 0===o?void 0:o.scrollingElement))return;const{scrollHeight:n,scrollWidth:l}=this._scrollingContainerRef.scrollingElement;void 0!==t&&(this._scrollingContainerRef.scrollingElement.scrollTop=this._validateScrollValue(t,n)),void 0!==e&&(this._scrollingContainerRef.scrollingElement.scrollLeft=this._validateScrollValue(e,l))},this._computeThreshold=function(){const{state:{clientWidth:t,clientHeight:e},props:{scrollThreshold:o=1},_scrollingContainerRef:n}=this;if(!(null==n?void 0:n.scrollingElement)||t===n.scrollingElement.clientWidth&&e===n.scrollingElement.clientHeight)return;const{clientWidth:l,clientHeight:i,scrollHeight:s,scrollWidth:r}=n.scrollingElement;let c={vertical:0,horizontal:0};if("string"==typeof o){const t=Math.abs(parseInt(o));c={vertical:this._validateScrollValue(t,s,i),horizontal:this._validateScrollValue(t,r,l)}}else{const t=o>1?1:o<=0?.1:o;c={vertical:t*i,horizontal:t*l}}this.state.computedScrollThreshold=c,this.state.clientWidth=l,this.state.clientHeight=i},this._getPossibleDirections=function(){this._computeThreshold();const{state:{clientHeight:t,clientWidth:e,computedScrollThreshold:{vertical:o,horizontal:n}},props:{reverse:l={}},_scrollingContainerRef:s}=this,{scrollHeight:r,scrollWidth:c,scrollLeft:h,scrollTop:a}=s.scrollingElement,{column:u,row:d}=l,f=(t,e)=>Math.abs(t)<=e,g=(t,e,o,n)=>Math.abs(t)>=Math.abs(e-o-n);return{[u?i.DOWN:i.UP]:f(a,o),[u?i.UP:i.DOWN]:g(a,r,t,o),[d?i.RIGHT:i.LEFT]:f(h,n),[d?i.LEFT:i.RIGHT]:g(h,c,e,n)}},this._loadByDirection=function(t,e,o){return n(this,void 0,void 0,(function*(){const{state:{isLoading:n,thresholdReached:s},props:{next:r,hasMore:c}}=this,h=t===i.UP?l.VERTICAL:l.HORIZONTAL;if(!n){const n=c[t]&&!s[t]&&o[t],l=!n&&c[e]&&!s[e]&&o[e];if(n||l)try{const o=n?t:e;this.state.thresholdReached[o]=!0,this.state.isLoading=!0,yield r(o)}finally{setTimeout((()=>this._onLoadComplete(h)),0)}}}))},this._checkOffsetAndLoadMore=function(){const{_scrollingContainerRef:t}=this;if(!t)return;const e=this._getPossibleDirections(),o=t=>{!e[t]&&this.state.thresholdReached[t]&&(this.state.thresholdReached[t]=!1)};Object.values(i).forEach((t=>o(t))),this._loadByDirection(i.UP,i.DOWN,e),this._loadByDirection(i.LEFT,i.RIGHT,e)},this._setRef=function(t){var e,o,n;const l={scrollingElement:null,registerEventListener:null};if(this.props.windowScroll)l.scrollingElement=document.scrollingElement,l.registerEventListener=document;else{const i=null!==(n=null!==(e=null==t?void 0:t._scrollingContainer)&&void 0!==e?e:null===(o=null==t?void 0:t.Grid)||void 0===o?void 0:o._scrollingContainer)&&void 0!==n?n:t;l.scrollingElement=i,l.registerEventListener=i}const{scrollingElement:i,registerEventListener:s}=l;if(i&&s&&("number"!=typeof i.scrollHeight||"number"!=typeof i.scrollWidth||"number"!=typeof i.scrollLeft||"number"!=typeof i.scrollTop||"number"!=typeof i.clientHeight||"number"!=typeof i.clientWidth||"function"!=typeof s.addEventListener||"function"!=typeof s.removeEventListener)||!i||!s)return void console.error("Sorry I can't use this container - try using a different DOM element.");this._scrollingContainerRef=l;const r=()=>{var t;if(!(null===(t=this._scrollingContainerRef)||void 0===t?void 0:t.scrollingElement))return;const{_scrollingContainerRef:{scrollingElement:e},props:{onScroll:o}}=this,{scrollHeight:n,scrollWidth:l,scrollLeft:i,scrollTop:s,clientHeight:r,clientWidth:c}=e;o&&o({clientHeight:r,clientWidth:c,scrollHeight:n,scrollWidth:l,scrollLeft:i,scrollTop:s}),this._checkOffsetAndLoadMore()};this.state.rowCount=this.props.rowCount,this.state.columnCount=this.props.columnCount,this.state.scrollHeight=this._scrollingContainerRef.scrollingElement.scrollHeight,this.state.scrollWidth=this._scrollingContainerRef.scrollingElement.scrollWidth;const{initialScroll:c}=this.props;c&&this._scroll({scrollTop:c.top,scrollLeft:c.left}),this._onCleanup(),this._scrollingContainerRef.registerEventListener.addEventListener("scroll",r),this.state.cleanup.push((()=>{var t,e;return null===(e=null===(t=this._scrollingContainerRef)||void 0===t?void 0:t.registerEventListener)||void 0===e?void 0:e.removeEventListener("scroll",r)})),this._checkOffsetAndLoadMore()},this._onLoadComplete=function(t){var e;if(!(null===(e=this._scrollingContainerRef)||void 0===e?void 0:e.scrollingElement))return;const o=t===l.VERTICAL,{state:{rowCount:n=0,columnCount:i=0,scrollHeight:s,scrollWidth:r},props:{rowCount:c=0,columnCount:h=0,reverse:a={}},_scrollingContainerRef:u}=this,{scrollTop:d,scrollLeft:f,scrollHeight:g,scrollWidth:p,clientHeight:v,clientWidth:m}=u.scrollingElement,C=o?c:h,_=o?d:f,E=o?g:p,L=o?s:r,R=o?v:m;if((o?n:i)!==C&&Math.abs(_)<R){const t=a[o?"column":"row"]?-1:1;this._scroll({["scroll"+(o?"Top":"Left")]:_+(E-L)*t})}this.state.isLoading=!1,this.state[o?"scrollHeight":"scrollWidth"]=E,this.state[o?"rowCount":"columnCount"]=C,setTimeout((()=>this._checkOffsetAndLoadMore()),100)},this._onPropsChange=function(t){this.props=t;const{state:{isLoading:e},props:{rowCount:o,columnCount:n,hasMore:l},_scrollingContainerRef:i}=this;i&&(void 0===o&&(l.down||l.up)&&console.warn(`You provided props with "hasMore: { up: ${!!l.up}, down: ${!!l.down} }" but "rowCount" is "undefined"`),void 0===n&&(l.left||l.right)&&console.warn(`You provided props with "hasMore: { left: ${!!l.left}, right: ${!!l.right} }" but "columnCount" is "undefined"`),e||this._checkOffsetAndLoadMore())},this._onCleanup=function(){const{state:{cleanup:t},_scrollingContainerRef:e}=this;(null==e?void 0:e.scrollingElement)&&"HTML"!==(null==e?void 0:e.scrollingElement.nodeName)||(t.forEach((t=>t())),this.state.cleanup=[])},this.setRef=this._setRef.bind(this),this.onPropsChange=this._onPropsChange.bind(this),this.onCleanup=this._onCleanup.bind(this),this.props=t,this.state={rowCount:t.rowCount,columnCount:t.columnCount,scrollHeight:0,scrollWidth:0,clientHeight:0,clientWidth:0,isLoading:!1,computedScrollThreshold:{vertical:0,horizontal:0},thresholdReached:{},cleanup:[]}}}const r=n=>{const{rowCount:l,columnCount:i,hasMore:{up:r,down:c,left:h,right:a},next:u,windowScroll:d}=n,{current:{setRef:f,onPropsChange:g,onCleanup:p}}=t(new s(n));return e((()=>(d&&f(null),p)),[]),o((()=>g(n)),[l,i,r,c,h,a,u]),{setRef:f}};export{s as InfiniteScroll,l as ScrollAxisName,i as ScrollDirection,r as default,r as useInfiniteScroll}; | ||
import{useRef as t,useLayoutEffect as e,useEffect as o}from"react";function n(t,e,o,n){return new(o||(o=Promise))((function(l,i){function s(t){try{c(n.next(t))}catch(t){i(t)}}function r(t){try{c(n.throw(t))}catch(t){i(t)}}function c(t){var e;t.done?l(t.value):(e=t.value,e instanceof o?e:new o((function(t){t(e)}))).then(s,r)}c((n=n.apply(t,e||[])).next())}))}var l,i;!function(t){t.VERTICAL="vertical",t.HORIZONTAL="horizontal"}(l||(l={})),function(t){t.UP="up",t.DOWN="down",t.LEFT="left",t.RIGHT="right"}(i||(i={}));class s{constructor(t){this._validateScrollValue=(t,e,o)=>{const n=t<0?-1:1;return Math.abs(t)>e?null!=o?o:e*n:t},this._scroll=function({scrollTop:t,scrollLeft:e}){var o;if(!(null===(o=this._scrollingContainerRef)||void 0===o?void 0:o.scrollingElement))return;const{scrollHeight:n,scrollWidth:l}=this._scrollingContainerRef.scrollingElement;void 0!==t&&(this._scrollingContainerRef.scrollingElement.scrollTop=this._validateScrollValue(t,n)),void 0!==e&&(this._scrollingContainerRef.scrollingElement.scrollLeft=this._validateScrollValue(e,l))},this._computeThreshold=function(){const{state:{clientWidth:t,clientHeight:e},props:{scrollThreshold:o=1},_scrollingContainerRef:n}=this;if(!(null==n?void 0:n.scrollingElement)||t===n.scrollingElement.clientWidth&&e===n.scrollingElement.clientHeight)return;const{clientWidth:l,clientHeight:i,scrollHeight:s,scrollWidth:r}=n.scrollingElement;let c={vertical:0,horizontal:0};if("string"==typeof o){const t=Math.abs(parseInt(o));c={vertical:this._validateScrollValue(t,s,i),horizontal:this._validateScrollValue(t,r,l)}}else{const t=o>1?1:o<=0?.1:o;c={vertical:t*i,horizontal:t*l}}this.state.computedScrollThreshold=c,this.state.clientWidth=l,this.state.clientHeight=i},this._getPossibleDirections=function(){this._computeThreshold();const{state:{clientHeight:t,clientWidth:e,computedScrollThreshold:{vertical:o,horizontal:n}},props:{reverse:l={}},_scrollingContainerRef:s}=this,{scrollHeight:r,scrollWidth:c,scrollLeft:h,scrollTop:a}=s.scrollingElement,{column:u,row:d}=l,f=(t,e)=>Math.abs(t)<=e,g=(t,e,o,n)=>Math.abs(t)>=Math.abs(e-o-n);return{[u?i.DOWN:i.UP]:f(a,o),[u?i.UP:i.DOWN]:g(a,r,t,o),[d?i.RIGHT:i.LEFT]:f(h,n),[d?i.LEFT:i.RIGHT]:g(h,c,e,n)}},this._loadByDirection=function(t,e,o){return n(this,void 0,void 0,(function*(){const{state:{isLoading:n,thresholdReached:s},props:{next:r,hasMore:c}}=this,h=t===i.UP?l.VERTICAL:l.HORIZONTAL;if(!n){const n=c[t]&&!s[t]&&o[t],l=!n&&c[e]&&!s[e]&&o[e];if(n||l)try{const o=n?t:e;this.state.thresholdReached[o]=!0,this.state.isLoading=!0,yield r(o)}finally{setTimeout((()=>this._onLoadComplete(h)),0)}}}))},this._checkOffsetAndLoadMore=function(){const{_scrollingContainerRef:t}=this;if(!t)return;const e=this._getPossibleDirections(),o=t=>{!e[t]&&this.state.thresholdReached[t]&&(this.state.thresholdReached[t]=!1)};Object.values(i).forEach((t=>o(t))),this._loadByDirection(i.UP,i.DOWN,e),this._loadByDirection(i.LEFT,i.RIGHT,e)},this._setRef=function(t){var e,o,n;const l={scrollingElement:null,registerEventListener:null};if(this.props.windowScroll)l.scrollingElement=document.scrollingElement,l.registerEventListener=document;else{const i=null!==(n=null!==(e=null==t?void 0:t._scrollingContainer)&&void 0!==e?e:null===(o=null==t?void 0:t.Grid)||void 0===o?void 0:o._scrollingContainer)&&void 0!==n?n:t;l.scrollingElement=i,l.registerEventListener=i}const{scrollingElement:i,registerEventListener:s}=l;if(i&&s&&("number"!=typeof i.scrollHeight||"number"!=typeof i.scrollWidth||"number"!=typeof i.scrollLeft||"number"!=typeof i.scrollTop||"number"!=typeof i.clientHeight||"number"!=typeof i.clientWidth||"function"!=typeof s.addEventListener||"function"!=typeof s.removeEventListener)||!i||!s)return void console.error("Sorry I can't use this container - try using a different DOM element.");this._scrollingContainerRef=l;const r=()=>{var t;if(!(null===(t=this._scrollingContainerRef)||void 0===t?void 0:t.scrollingElement))return;const{_scrollingContainerRef:{scrollingElement:e},props:{onScroll:o}}=this,{scrollHeight:n,scrollWidth:l,scrollLeft:i,scrollTop:s,clientHeight:r,clientWidth:c}=e;o&&o({clientHeight:r,clientWidth:c,scrollHeight:n,scrollWidth:l,scrollLeft:i,scrollTop:s}),this._checkOffsetAndLoadMore()};this.state.rowCount=this.props.rowCount,this.state.columnCount=this.props.columnCount,this.state.scrollHeight=this._scrollingContainerRef.scrollingElement.scrollHeight,this.state.scrollWidth=this._scrollingContainerRef.scrollingElement.scrollWidth;const{initialScroll:c}=this.props;c&&this._scroll({scrollTop:c.top,scrollLeft:c.left}),this._onCleanup(),this._scrollingContainerRef.registerEventListener.addEventListener("scroll",r),this.state.cleanup.push((()=>{var t,e;return null===(e=null===(t=this._scrollingContainerRef)||void 0===t?void 0:t.registerEventListener)||void 0===e?void 0:e.removeEventListener("scroll",r)})),this._checkOffsetAndLoadMore()},this._onLoadComplete=function(t){var e;if(!(null===(e=this._scrollingContainerRef)||void 0===e?void 0:e.scrollingElement))return;const o=t===l.VERTICAL,{state:{rowCount:n=0,columnCount:i=0,scrollHeight:s,scrollWidth:r},props:{rowCount:c=0,columnCount:h=0,reverse:a={}},_scrollingContainerRef:u}=this,{scrollTop:d,scrollLeft:f,scrollHeight:g,scrollWidth:p,clientHeight:v,clientWidth:m}=u.scrollingElement,C=o?c:h,_=o?d:f,L=o?g:p,E=o?s:r,R=o?v:m;if((o?n:i)!==C&&Math.abs(_)<R){const t=a[o?"column":"row"]?-1:1;this._scroll({["scroll"+(o?"Top":"Left")]:_+(L-E)*t})}this.state.isLoading=!1,this.state[o?"scrollHeight":"scrollWidth"]=L,this.state[o?"rowCount":"columnCount"]=C,setTimeout((()=>this._checkOffsetAndLoadMore()),100)},this._onPropsChange=function(t){this.props=t;const{state:{isLoading:e},props:{rowCount:o,columnCount:n,hasMore:l},_scrollingContainerRef:i}=this;i&&(void 0===o&&(l.down||l.up)&&console.warn(`You provided props with "hasMore: { up: ${!!l.up}, down: ${!!l.down} }" but "rowCount" is "undefined"`),void 0===n&&(l.left||l.right)&&console.warn(`You provided props with "hasMore: { left: ${!!l.left}, right: ${!!l.right} }" but "columnCount" is "undefined"`),e||this._checkOffsetAndLoadMore())},this._onCleanup=function(){const{state:{cleanup:t}}=this;t.length&&(t.forEach((t=>t())),this.state.cleanup=[])},this.setRef=this._setRef.bind(this),this.onPropsChange=this._onPropsChange.bind(this),this.onCleanup=this._onCleanup.bind(this),this.props=t,this.state={rowCount:t.rowCount,columnCount:t.columnCount,scrollHeight:0,scrollWidth:0,clientHeight:0,clientWidth:0,isLoading:!1,computedScrollThreshold:{vertical:0,horizontal:0},thresholdReached:{},cleanup:[]}}}const r=n=>{const{rowCount:l,columnCount:i,hasMore:{up:r,down:c,left:h,right:a},next:u,windowScroll:d}=n,{current:{setRef:f,onPropsChange:g,onCleanup:p}}=t(new s(n));return e((()=>(d&&f(null),d?p:void 0)),[]),o((()=>g(n)),[l,i,r,c,h,a,u]),{setRef:f}};export{s as InfiniteScroll,l as ScrollAxisName,i as ScrollDirection,r as default,r as useInfiniteScroll}; | ||
//# sourceMappingURL=index.js.map |
{ | ||
"name": "react-easy-infinite-scroll-hook", | ||
"version": "1.8.6", | ||
"version": "1.8.7", | ||
"license": "MIT", | ||
@@ -5,0 +5,0 @@ "description": "A react hook for creating simple, fast and lightweight components with infinite scrolling in any direction, supporting both windowed and scrollable elements.", |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
116868