react-easy-infinite-scroll-hook
Advanced tools
Comparing version 1.0.9 to 1.0.10
@@ -1,2 +0,2 @@ | ||
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t,e=require("react");function o(t,e,o,i){return new(o||(o=Promise))((function(s,l){function r(t){try{c(i.next(t))}catch(t){l(t)}}function n(t){try{c(i.throw(t))}catch(t){l(t)}}function c(t){var e;t.done?s(t.value):(e=t.value,e instanceof o?e:new o((function(t){t(e)}))).then(r,n)}c((i=i.apply(t,e||[])).next())}))}exports.ScrollDirection=void 0,(t=exports.ScrollDirection||(exports.ScrollDirection={})).UP="up",t.DOWN="down",t.LEFT="left",t.RIGHT="right";class i{constructor(t){this._validateScrollValue=(t,e,o)=>{const i=t<0?-1:1;return Math.abs(t)>e?null!=o?o:e*i:t},this._scroll=function({scrollTop:t,scrollLeft:e}){if(!this._scrollingContainerRef)return;const{scrollHeight:o,scrollWidth:i}=this._scrollingContainerRef;void 0!==t&&(this._scrollingContainerRef.scrollTop=this._validateScrollValue(t,o)),void 0!==e&&(this._scrollingContainerRef.scrollLeft=this._validateScrollValue(e,i))},this._computeThreshold=function(){const{state:{clientWidth:t,clientHeight:e},props:{scrollThreshold:o=1},_scrollingContainerRef:i}=this;if(!i||t===i.clientWidth&&e===i.clientHeight)return;const{clientWidth:s,clientHeight:l,scrollHeight:r,scrollWidth:n}=i;let c={vertical:0,horizontal:0};if("string"==typeof o){const t=Math.abs(parseInt(o));c={vertical:this._validateScrollValue(t,r,l),horizontal:this._validateScrollValue(t,n,s)}}else{const t=o>1?1:o<=0?.1:o;c={vertical:t*l,horizontal:t*s}}this.state.computedScrollThreshold=c,this.state.clientWidth=s,this.state.clientHeight=l},this._getPossibleDirection=function(){this._computeThreshold();const{state:{clientHeight:t,clientWidth:e,computedScrollThreshold:{vertical:o,horizontal:i}},props:{reverse:s={}},_scrollingContainerRef:l}=this,{scrollHeight:r,scrollWidth:n,scrollLeft:c,scrollTop:h}=l,{vertical:a,horizontal:d}=s,f=(t,e)=>Math.abs(t)<=e,g=(t,e,o,i)=>Math.abs(t)>=Math.abs(e-o-i);return{[a?exports.ScrollDirection.DOWN:exports.ScrollDirection.UP]:f(h,o),[a?exports.ScrollDirection.UP:exports.ScrollDirection.DOWN]:g(h,r,t,o),[d?exports.ScrollDirection.RIGHT:exports.ScrollDirection.LEFT]:f(c,i),[d?exports.ScrollDirection.LEFT:exports.ScrollDirection.RIGHT]:g(c,n,e,i)}},this._checkOffsetAndLoadMore=function(){const{state:{isLoading:{start:t}},props:{next:e,hasMore:i},_scrollingContainerRef:s}=this;if(!s)return;const l=this._getPossibleDirection(),r=(s,r)=>o(this,void 0,void 0,(function*(){const o=s===exports.ScrollDirection.UP?"vertical":"horizontal";if(!t[o]&&!t[o]){const t=i[s]&&l[s],n=!t&&i[r]&&l[r];if(t||n)try{const i=t?s:r;this.state.isLoading.start[o]=!0,yield e(i)}finally{this.state.isLoading.end[o]=!0}}}));r(exports.ScrollDirection.UP,exports.ScrollDirection.DOWN),r(exports.ScrollDirection.LEFT,exports.ScrollDirection.RIGHT)},this._setRef=function(t){var e,o,i;if(this._scrollingContainerRef)return;const s=null!==(i=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!==i?i:t;if(s&&"number"!=typeof s.scrollHeight&&"number"!=typeof s.scrollWidth&&"number"!=typeof s.scrollLeft&&"number"!=typeof s.scrollTop&&"number"!=typeof s.clientHeight&&"number"!=typeof s.clientWidth&&"function"!=typeof s.addEventListener&&"function"!=typeof s.removeEventListener||!s)return void console.error("Sorry I can't use this container - try using a different DOM element.");this._scrollingContainerRef=s;const l=()=>{if(!this._scrollingContainerRef)return;const{_scrollingContainerRef:{scrollHeight:t,scrollWidth:e,scrollLeft:o,scrollTop:i},props:{onScroll:s}}=this;s&&s({scrollHeight:t,scrollWidth:e,scrollLeft:o,scrollTop:i}),this._checkOffsetAndLoadMore()};this.state.scrollHeight=this._scrollingContainerRef.scrollHeight,this.state.scrollWidth=this._scrollingContainerRef.scrollWidth;const{initialScroll:r}=this.props;r&&this._scroll({scrollTop:r.top,scrollLeft:r.left}),this._scrollingContainerRef.addEventListener("scroll",l),this.onCleanup=()=>{var t;return null===(t=this._scrollingContainerRef)||void 0===t?void 0:t.removeEventListener("scroll",l)},this._checkOffsetAndLoadMore()},this._onPropsChange=function(t){this.props=t;const{state:{rowLength:e=0,columnLength:o=0,isLoading:{start:i,end:s}},props:{rowLength:l=0,columnLength:r=0,reverse:n={}},_scrollingContainerRef:c}=this;if(!c)return;const{scrollTop:h,scrollLeft:a,scrollHeight:d,scrollWidth:f,clientHeight:g,clientWidth:u}=c,{vertical:p,horizontal:v}=n,L=(t,e,o,i,s,l,r,n,c,h)=>{const a=c.start&&c.end;if(o!==i&&a&&Math.abs(t)<e){r(t+(l-s)*(h?-1:1))}a&&n()};L(h,g,e,l,this.state.scrollHeight,d,(t=>{this._scroll({scrollTop:t})}),(()=>{this.state.isLoading={start:Object.assign(Object.assign({},this.state.isLoading.start),{vertical:!1}),end:Object.assign(Object.assign({},this.state.isLoading.end),{vertical:!1})}}),{start:i.vertical,end:s.vertical},p),L(a,u,o,r,this.state.scrollWidth,f,(t=>{this._scroll({scrollLeft:t})}),(()=>{this.state.isLoading={start:Object.assign(Object.assign({},this.state.isLoading.start),{horizontal:!1}),end:Object.assign(Object.assign({},this.state.isLoading.end),{horizontal:!1})}}),{start:i.horizontal,end:s.horizontal},v),this.state.scrollHeight=d,this.state.rowLength=l,this.state.scrollWidth=f,this.state.columnLength=r,this._checkOffsetAndLoadMore()},this.setRef=this._setRef.bind(this),this.onPropsChange=this._onPropsChange.bind(this),this.props=t,this.state={rowLength:t.rowLength,columnLength:t.columnLength,scrollHeight:0,scrollWidth:0,clientHeight:0,clientWidth:0,isLoading:{start:{vertical:!1,horizontal:!1},end:{vertical:!1,horizontal:!1}},computedScrollThreshold:{vertical:0,horizontal:0}}}}exports.InfiniteScroll=i,exports.useInfiniteScroll=t=>{const{rowLength:o,columnLength:s,hasMore:{up:l,down:r,left:n,right:c}}=t,{current:{setRef:h,onPropsChange:a,onCleanup:d}}=e.useRef(new i(t));return e.useEffect((()=>d),[]),e.useEffect((()=>a(t)),[o,s,l,r,n,c]),{setRef:h}}; | ||
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t,e=require("react");function o(t,e,o,i){return new(o||(o=Promise))((function(s,l){function r(t){try{c(i.next(t))}catch(t){l(t)}}function n(t){try{c(i.throw(t))}catch(t){l(t)}}function c(t){var e;t.done?s(t.value):(e=t.value,e instanceof o?e:new o((function(t){t(e)}))).then(r,n)}c((i=i.apply(t,e||[])).next())}))}exports.ScrollDirection=void 0,(t=exports.ScrollDirection||(exports.ScrollDirection={})).UP="up",t.DOWN="down",t.LEFT="left",t.RIGHT="right";class i{constructor(t){this._validateScrollValue=(t,e,o)=>{const i=t<0?-1:1;return Math.abs(t)>e?null!=o?o:e*i:t},this._scroll=function({scrollTop:t,scrollLeft:e}){if(!this._scrollingContainerRef)return;const{scrollHeight:o,scrollWidth:i}=this._scrollingContainerRef;void 0!==t&&(this._scrollingContainerRef.scrollTop=this._validateScrollValue(t,o)),void 0!==e&&(this._scrollingContainerRef.scrollLeft=this._validateScrollValue(e,i))},this._computeThreshold=function(){const{state:{clientWidth:t,clientHeight:e},props:{scrollThreshold:o=1},_scrollingContainerRef:i}=this;if(!i||t===i.clientWidth&&e===i.clientHeight)return;const{clientWidth:s,clientHeight:l,scrollHeight:r,scrollWidth:n}=i;let c={vertical:0,horizontal:0};if("string"==typeof o){const t=Math.abs(parseInt(o));c={vertical:this._validateScrollValue(t,r,l),horizontal:this._validateScrollValue(t,n,s)}}else{const t=o>1?1:o<=0?.1:o;c={vertical:t*l,horizontal:t*s}}this.state.computedScrollThreshold=c,this.state.clientWidth=s,this.state.clientHeight=l},this._getPossibleDirection=function(){this._computeThreshold();const{state:{clientHeight:t,clientWidth:e,computedScrollThreshold:{vertical:o,horizontal:i}},props:{reverse:s={}},_scrollingContainerRef:l}=this,{scrollHeight:r,scrollWidth:n,scrollLeft:c,scrollTop:h}=l,{vertical:a,horizontal:d}=s,f=(t,e)=>Math.abs(t)<=e,g=(t,e,o,i)=>Math.abs(t)>=Math.abs(e-o-i);return{[a?exports.ScrollDirection.DOWN:exports.ScrollDirection.UP]:f(h,o),[a?exports.ScrollDirection.UP:exports.ScrollDirection.DOWN]:g(h,r,t,o),[d?exports.ScrollDirection.RIGHT:exports.ScrollDirection.LEFT]:f(c,i),[d?exports.ScrollDirection.LEFT:exports.ScrollDirection.RIGHT]:g(c,n,e,i)}},this._checkOffsetAndLoadMore=function(){const{state:{isLoading:{start:t}},props:{next:e,hasMore:i},_scrollingContainerRef:s}=this;if(!s)return;const l=this._getPossibleDirection(),r=(s,r)=>o(this,void 0,void 0,(function*(){const o=s===exports.ScrollDirection.UP?"vertical":"horizontal";if(!t[o]&&!t[o]){const t=i[s]&&l[s],n=!t&&i[r]&&l[r];if(t||n)try{const i=t?s:r;this.state.isLoading.start[o]=!0,yield e(i)}finally{this.state.isLoading.end[o]=!0}}}));r(exports.ScrollDirection.UP,exports.ScrollDirection.DOWN),r(exports.ScrollDirection.LEFT,exports.ScrollDirection.RIGHT)},this._setRef=function(t){var e,o,i;const s=null!==(i=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!==i?i:t;if(s&&"number"!=typeof s.scrollHeight&&"number"!=typeof s.scrollWidth&&"number"!=typeof s.scrollLeft&&"number"!=typeof s.scrollTop&&"number"!=typeof s.clientHeight&&"number"!=typeof s.clientWidth&&"function"!=typeof s.addEventListener&&"function"!=typeof s.removeEventListener||!s)return void console.error("Sorry I can't use this container - try using a different DOM element.");this._scrollingContainerRef=s;const l=()=>{if(!this._scrollingContainerRef)return;const{_scrollingContainerRef:{scrollHeight:t,scrollWidth:e,scrollLeft:o,scrollTop:i},props:{onScroll:s}}=this;s&&s({scrollHeight:t,scrollWidth:e,scrollLeft:o,scrollTop:i}),this._checkOffsetAndLoadMore()};this.state.scrollHeight=this._scrollingContainerRef.scrollHeight,this.state.scrollWidth=this._scrollingContainerRef.scrollWidth;const{initialScroll:r}=this.props;r&&this._scroll({scrollTop:r.top,scrollLeft:r.left}),this._scrollingContainerRef.addEventListener("scroll",l),this.onCleanup=()=>{var t;return null===(t=this._scrollingContainerRef)||void 0===t?void 0:t.removeEventListener("scroll",l)},this._checkOffsetAndLoadMore()},this._onPropsChange=function(t){this.props=t;const{state:{rowLength:e=0,columnLength:o=0,isLoading:{start:i,end:s}},props:{rowLength:l=0,columnLength:r=0,reverse:n={}},_scrollingContainerRef:c}=this;if(!c)return;const{scrollTop:h,scrollLeft:a,scrollHeight:d,scrollWidth:f,clientHeight:g,clientWidth:u}=c,{vertical:p,horizontal:v}=n,L=(t,e,o,i,s,l,r,n,c,h)=>{const a=c.start&&c.end;if(o!==i&&a&&Math.abs(t)<e){r(t+(l-s)*(h?-1:1))}a&&n()};L(h,g,e,l,this.state.scrollHeight,d,(t=>{this._scroll({scrollTop:t})}),(()=>{this.state.isLoading={start:Object.assign(Object.assign({},this.state.isLoading.start),{vertical:!1}),end:Object.assign(Object.assign({},this.state.isLoading.end),{vertical:!1})}}),{start:i.vertical,end:s.vertical},p),L(a,u,o,r,this.state.scrollWidth,f,(t=>{this._scroll({scrollLeft:t})}),(()=>{this.state.isLoading={start:Object.assign(Object.assign({},this.state.isLoading.start),{horizontal:!1}),end:Object.assign(Object.assign({},this.state.isLoading.end),{horizontal:!1})}}),{start:i.horizontal,end:s.horizontal},v),this.state.scrollHeight=d,this.state.rowLength=l,this.state.scrollWidth=f,this.state.columnLength=r,this._checkOffsetAndLoadMore()},this.setRef=this._setRef.bind(this),this.onPropsChange=this._onPropsChange.bind(this),this.props=t,this.state={rowLength:t.rowLength,columnLength:t.columnLength,scrollHeight:0,scrollWidth:0,clientHeight:0,clientWidth:0,isLoading:{start:{vertical:!1,horizontal:!1},end:{vertical:!1,horizontal:!1}},computedScrollThreshold:{vertical:0,horizontal:0}}}}exports.InfiniteScroll=i,exports.useInfiniteScroll=t=>{const{rowLength:o,columnLength:s,hasMore:{up:l,down:r,left:n,right:c}}=t,{current:{setRef:h,onPropsChange:a,onCleanup:d}}=e.useRef(new i(t));return e.useEffect((()=>d),[]),e.useEffect((()=>a(t)),[o,s,l,r,n,c]),{setRef:h}}; | ||
//# sourceMappingURL=index.js.map |
@@ -1,2 +0,2 @@ | ||
import{useRef as t,useEffect as i}from"react";var e;function o(t,i,e,o){return new(e||(e=Promise))((function(s,n){function l(t){try{c(o.next(t))}catch(t){n(t)}}function r(t){try{c(o.throw(t))}catch(t){n(t)}}function c(t){var i;t.done?s(t.value):(i=t.value,i instanceof e?i:new e((function(t){t(i)}))).then(l,r)}c((o=o.apply(t,i||[])).next())}))}!function(t){t.UP="up",t.DOWN="down",t.LEFT="left",t.RIGHT="right"}(e||(e={}));class s{constructor(t){this._validateScrollValue=(t,i,e)=>{const o=t<0?-1:1;return Math.abs(t)>i?null!=e?e:i*o:t},this._scroll=function({scrollTop:t,scrollLeft:i}){if(!this._scrollingContainerRef)return;const{scrollHeight:e,scrollWidth:o}=this._scrollingContainerRef;void 0!==t&&(this._scrollingContainerRef.scrollTop=this._validateScrollValue(t,e)),void 0!==i&&(this._scrollingContainerRef.scrollLeft=this._validateScrollValue(i,o))},this._computeThreshold=function(){const{state:{clientWidth:t,clientHeight:i},props:{scrollThreshold:e=1},_scrollingContainerRef:o}=this;if(!o||t===o.clientWidth&&i===o.clientHeight)return;const{clientWidth:s,clientHeight:n,scrollHeight:l,scrollWidth:r}=o;let c={vertical:0,horizontal:0};if("string"==typeof e){const t=Math.abs(parseInt(e));c={vertical:this._validateScrollValue(t,l,n),horizontal:this._validateScrollValue(t,r,s)}}else{const t=e>1?1:e<=0?.1:e;c={vertical:t*n,horizontal:t*s}}this.state.computedScrollThreshold=c,this.state.clientWidth=s,this.state.clientHeight=n},this._getPossibleDirection=function(){this._computeThreshold();const{state:{clientHeight:t,clientWidth:i,computedScrollThreshold:{vertical:o,horizontal:s}},props:{reverse:n={}},_scrollingContainerRef:l}=this,{scrollHeight:r,scrollWidth:c,scrollLeft:h,scrollTop:a}=l,{vertical:d,horizontal:f}=n,g=(t,i)=>Math.abs(t)<=i,u=(t,i,e,o)=>Math.abs(t)>=Math.abs(i-e-o);return{[d?e.DOWN:e.UP]:g(a,o),[d?e.UP:e.DOWN]:u(a,r,t,o),[f?e.RIGHT:e.LEFT]:g(h,s),[f?e.LEFT:e.RIGHT]:u(h,c,i,s)}},this._checkOffsetAndLoadMore=function(){const{state:{isLoading:{start:t}},props:{next:i,hasMore:s},_scrollingContainerRef:n}=this;if(!n)return;const l=this._getPossibleDirection(),r=(n,r)=>o(this,void 0,void 0,(function*(){const o=n===e.UP?"vertical":"horizontal";if(!t[o]&&!t[o]){const t=s[n]&&l[n],e=!t&&s[r]&&l[r];if(t||e)try{const e=t?n:r;this.state.isLoading.start[o]=!0,yield i(e)}finally{this.state.isLoading.end[o]=!0}}}));r(e.UP,e.DOWN),r(e.LEFT,e.RIGHT)},this._setRef=function(t){var i,e,o;if(this._scrollingContainerRef)return;const s=null!==(o=null!==(i=null==t?void 0:t._scrollingContainer)&&void 0!==i?i:null===(e=null==t?void 0:t.Grid)||void 0===e?void 0:e._scrollingContainer)&&void 0!==o?o:t;if(s&&"number"!=typeof s.scrollHeight&&"number"!=typeof s.scrollWidth&&"number"!=typeof s.scrollLeft&&"number"!=typeof s.scrollTop&&"number"!=typeof s.clientHeight&&"number"!=typeof s.clientWidth&&"function"!=typeof s.addEventListener&&"function"!=typeof s.removeEventListener||!s)return void console.error("Sorry I can't use this container - try using a different DOM element.");this._scrollingContainerRef=s;const n=()=>{if(!this._scrollingContainerRef)return;const{_scrollingContainerRef:{scrollHeight:t,scrollWidth:i,scrollLeft:e,scrollTop:o},props:{onScroll:s}}=this;s&&s({scrollHeight:t,scrollWidth:i,scrollLeft:e,scrollTop:o}),this._checkOffsetAndLoadMore()};this.state.scrollHeight=this._scrollingContainerRef.scrollHeight,this.state.scrollWidth=this._scrollingContainerRef.scrollWidth;const{initialScroll:l}=this.props;l&&this._scroll({scrollTop:l.top,scrollLeft:l.left}),this._scrollingContainerRef.addEventListener("scroll",n),this.onCleanup=()=>{var t;return null===(t=this._scrollingContainerRef)||void 0===t?void 0:t.removeEventListener("scroll",n)},this._checkOffsetAndLoadMore()},this._onPropsChange=function(t){this.props=t;const{state:{rowLength:i=0,columnLength:e=0,isLoading:{start:o,end:s}},props:{rowLength:n=0,columnLength:l=0,reverse:r={}},_scrollingContainerRef:c}=this;if(!c)return;const{scrollTop:h,scrollLeft:a,scrollHeight:d,scrollWidth:f,clientHeight:g,clientWidth:u}=c,{vertical:p,horizontal:v}=r,L=(t,i,e,o,s,n,l,r,c,h)=>{const a=c.start&&c.end;if(e!==o&&a&&Math.abs(t)<i){l(t+(n-s)*(h?-1:1))}a&&r()};L(h,g,i,n,this.state.scrollHeight,d,(t=>{this._scroll({scrollTop:t})}),(()=>{this.state.isLoading={start:Object.assign(Object.assign({},this.state.isLoading.start),{vertical:!1}),end:Object.assign(Object.assign({},this.state.isLoading.end),{vertical:!1})}}),{start:o.vertical,end:s.vertical},p),L(a,u,e,l,this.state.scrollWidth,f,(t=>{this._scroll({scrollLeft:t})}),(()=>{this.state.isLoading={start:Object.assign(Object.assign({},this.state.isLoading.start),{horizontal:!1}),end:Object.assign(Object.assign({},this.state.isLoading.end),{horizontal:!1})}}),{start:o.horizontal,end:s.horizontal},v),this.state.scrollHeight=d,this.state.rowLength=n,this.state.scrollWidth=f,this.state.columnLength=l,this._checkOffsetAndLoadMore()},this.setRef=this._setRef.bind(this),this.onPropsChange=this._onPropsChange.bind(this),this.props=t,this.state={rowLength:t.rowLength,columnLength:t.columnLength,scrollHeight:0,scrollWidth:0,clientHeight:0,clientWidth:0,isLoading:{start:{vertical:!1,horizontal:!1},end:{vertical:!1,horizontal:!1}},computedScrollThreshold:{vertical:0,horizontal:0}}}}const n=e=>{const{rowLength:o,columnLength:n,hasMore:{up:l,down:r,left:c,right:h}}=e,{current:{setRef:a,onPropsChange:d,onCleanup:f}}=t(new s(e));return i((()=>f),[]),i((()=>d(e)),[o,n,l,r,c,h]),{setRef:a}};export{s as InfiniteScroll,e as ScrollDirection,n as useInfiniteScroll}; | ||
import{useRef as t,useEffect as i}from"react";var e;function o(t,i,e,o){return new(e||(e=Promise))((function(s,n){function l(t){try{c(o.next(t))}catch(t){n(t)}}function r(t){try{c(o.throw(t))}catch(t){n(t)}}function c(t){var i;t.done?s(t.value):(i=t.value,i instanceof e?i:new e((function(t){t(i)}))).then(l,r)}c((o=o.apply(t,i||[])).next())}))}!function(t){t.UP="up",t.DOWN="down",t.LEFT="left",t.RIGHT="right"}(e||(e={}));class s{constructor(t){this._validateScrollValue=(t,i,e)=>{const o=t<0?-1:1;return Math.abs(t)>i?null!=e?e:i*o:t},this._scroll=function({scrollTop:t,scrollLeft:i}){if(!this._scrollingContainerRef)return;const{scrollHeight:e,scrollWidth:o}=this._scrollingContainerRef;void 0!==t&&(this._scrollingContainerRef.scrollTop=this._validateScrollValue(t,e)),void 0!==i&&(this._scrollingContainerRef.scrollLeft=this._validateScrollValue(i,o))},this._computeThreshold=function(){const{state:{clientWidth:t,clientHeight:i},props:{scrollThreshold:e=1},_scrollingContainerRef:o}=this;if(!o||t===o.clientWidth&&i===o.clientHeight)return;const{clientWidth:s,clientHeight:n,scrollHeight:l,scrollWidth:r}=o;let c={vertical:0,horizontal:0};if("string"==typeof e){const t=Math.abs(parseInt(e));c={vertical:this._validateScrollValue(t,l,n),horizontal:this._validateScrollValue(t,r,s)}}else{const t=e>1?1:e<=0?.1:e;c={vertical:t*n,horizontal:t*s}}this.state.computedScrollThreshold=c,this.state.clientWidth=s,this.state.clientHeight=n},this._getPossibleDirection=function(){this._computeThreshold();const{state:{clientHeight:t,clientWidth:i,computedScrollThreshold:{vertical:o,horizontal:s}},props:{reverse:n={}},_scrollingContainerRef:l}=this,{scrollHeight:r,scrollWidth:c,scrollLeft:h,scrollTop:a}=l,{vertical:d,horizontal:f}=n,g=(t,i)=>Math.abs(t)<=i,u=(t,i,e,o)=>Math.abs(t)>=Math.abs(i-e-o);return{[d?e.DOWN:e.UP]:g(a,o),[d?e.UP:e.DOWN]:u(a,r,t,o),[f?e.RIGHT:e.LEFT]:g(h,s),[f?e.LEFT:e.RIGHT]:u(h,c,i,s)}},this._checkOffsetAndLoadMore=function(){const{state:{isLoading:{start:t}},props:{next:i,hasMore:s},_scrollingContainerRef:n}=this;if(!n)return;const l=this._getPossibleDirection(),r=(n,r)=>o(this,void 0,void 0,(function*(){const o=n===e.UP?"vertical":"horizontal";if(!t[o]&&!t[o]){const t=s[n]&&l[n],e=!t&&s[r]&&l[r];if(t||e)try{const e=t?n:r;this.state.isLoading.start[o]=!0,yield i(e)}finally{this.state.isLoading.end[o]=!0}}}));r(e.UP,e.DOWN),r(e.LEFT,e.RIGHT)},this._setRef=function(t){var i,e,o;const s=null!==(o=null!==(i=null==t?void 0:t._scrollingContainer)&&void 0!==i?i:null===(e=null==t?void 0:t.Grid)||void 0===e?void 0:e._scrollingContainer)&&void 0!==o?o:t;if(s&&"number"!=typeof s.scrollHeight&&"number"!=typeof s.scrollWidth&&"number"!=typeof s.scrollLeft&&"number"!=typeof s.scrollTop&&"number"!=typeof s.clientHeight&&"number"!=typeof s.clientWidth&&"function"!=typeof s.addEventListener&&"function"!=typeof s.removeEventListener||!s)return void console.error("Sorry I can't use this container - try using a different DOM element.");this._scrollingContainerRef=s;const n=()=>{if(!this._scrollingContainerRef)return;const{_scrollingContainerRef:{scrollHeight:t,scrollWidth:i,scrollLeft:e,scrollTop:o},props:{onScroll:s}}=this;s&&s({scrollHeight:t,scrollWidth:i,scrollLeft:e,scrollTop:o}),this._checkOffsetAndLoadMore()};this.state.scrollHeight=this._scrollingContainerRef.scrollHeight,this.state.scrollWidth=this._scrollingContainerRef.scrollWidth;const{initialScroll:l}=this.props;l&&this._scroll({scrollTop:l.top,scrollLeft:l.left}),this._scrollingContainerRef.addEventListener("scroll",n),this.onCleanup=()=>{var t;return null===(t=this._scrollingContainerRef)||void 0===t?void 0:t.removeEventListener("scroll",n)},this._checkOffsetAndLoadMore()},this._onPropsChange=function(t){this.props=t;const{state:{rowLength:i=0,columnLength:e=0,isLoading:{start:o,end:s}},props:{rowLength:n=0,columnLength:l=0,reverse:r={}},_scrollingContainerRef:c}=this;if(!c)return;const{scrollTop:h,scrollLeft:a,scrollHeight:d,scrollWidth:f,clientHeight:g,clientWidth:u}=c,{vertical:p,horizontal:v}=r,L=(t,i,e,o,s,n,l,r,c,h)=>{const a=c.start&&c.end;if(e!==o&&a&&Math.abs(t)<i){l(t+(n-s)*(h?-1:1))}a&&r()};L(h,g,i,n,this.state.scrollHeight,d,(t=>{this._scroll({scrollTop:t})}),(()=>{this.state.isLoading={start:Object.assign(Object.assign({},this.state.isLoading.start),{vertical:!1}),end:Object.assign(Object.assign({},this.state.isLoading.end),{vertical:!1})}}),{start:o.vertical,end:s.vertical},p),L(a,u,e,l,this.state.scrollWidth,f,(t=>{this._scroll({scrollLeft:t})}),(()=>{this.state.isLoading={start:Object.assign(Object.assign({},this.state.isLoading.start),{horizontal:!1}),end:Object.assign(Object.assign({},this.state.isLoading.end),{horizontal:!1})}}),{start:o.horizontal,end:s.horizontal},v),this.state.scrollHeight=d,this.state.rowLength=n,this.state.scrollWidth=f,this.state.columnLength=l,this._checkOffsetAndLoadMore()},this.setRef=this._setRef.bind(this),this.onPropsChange=this._onPropsChange.bind(this),this.props=t,this.state={rowLength:t.rowLength,columnLength:t.columnLength,scrollHeight:0,scrollWidth:0,clientHeight:0,clientWidth:0,isLoading:{start:{vertical:!1,horizontal:!1},end:{vertical:!1,horizontal:!1}},computedScrollThreshold:{vertical:0,horizontal:0}}}}const n=e=>{const{rowLength:o,columnLength:n,hasMore:{up:l,down:r,left:c,right:h}}=e,{current:{setRef:a,onPropsChange:d,onCleanup:f}}=t(new s(e));return i((()=>f),[]),i((()=>d(e)),[o,n,l,r,c,h]),{setRef:a}};export{s as InfiniteScroll,e as ScrollDirection,n as useInfiniteScroll}; | ||
//# sourceMappingURL=index.js.map |
{ | ||
"name": "react-easy-infinite-scroll-hook", | ||
"version": "1.0.9", | ||
"version": "1.0.10", | ||
"license": "MIT", | ||
@@ -5,0 +5,0 @@ "description": "This hook allows you to create simple, lightweight components with infinite scrolling in all directions, 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
72854