masonic - npm Package Compare versions

Comparing version 3.7.0 to 4.0.0

dist/main/elements-cache.js

@@ -5,3 +5,2 @@ "use strict";
 exports.elementsCache = void 0;
-const elementsCache = /*#__PURE__*/new WeakMap();
-exports.elementsCache = elementsCache;
+const elementsCache = exports.elementsCache = /*#__PURE__*/new WeakMap();

dist/main/interval-tree.js

@@ -96,5 +96,3 @@ "use strict";
   y.P = x.P;
-  if (x.P === NULL_NODE) tree.root = y;else {
-    if (x === x.P.L) x.P.L = y;else x.P.R = y;
-  }
+  if (x.P === NULL_NODE) tree.root = y;else if (x === x.P.L) x.P.L = y;else x.P.R = y;
   y.L = x;
@@ -112,5 +110,3 @@ x.P = y;
   y.P = x.P;
-  if (x.P === NULL_NODE) tree.root = y;else {
-    if (x === x.P.R) x.P.R = y;else x.P.L = y;
-  }
+  if (x.P === NULL_NODE) tree.root = y;else if (x === x.P.R) x.P.R = y;else x.P.L = y;
   y.R = x;
@@ -117,0 +113,0 @@ x.P = y;

dist/main/use-resize-observer.js

@@ -7,4 +7,2 @@ "use strict";
 
-var _resizeObserver = /*#__PURE__*/require("@juggle/resize-observer");
-
 var _rafSchd = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require("raf-schd"));
@@ -26,3 +24,2 @@
 
-const ResizeObserver = typeof window !== "undefined" && "ResizeObserver" in window ? window.ResizeObserver : _resizeObserver.ResizeObserver;
 /**
@@ -34,3 +31,2 @@ * Creates a resize observer that forces updates to the grid cell positions when mutations are
  */
-
 function useResizeObserver(positioner) {
@@ -62,3 +58,3 @@ const forceUpdate = (0, _useForceUpdate.useForceUpdate)();
  */
-const createResizeObserver = /*#__PURE__*/(0, _trieMemoize.default)([WeakMap], // TODO: figure out a way to test this
+const createResizeObserver = exports.createResizeObserver = /*#__PURE__*/(0, _trieMemoize.default)([WeakMap], // TODO: figure out a way to test this
 
@@ -128,3 +124,2 @@ /* istanbul ignore next */
   return ro;
-});
-exports.createResizeObserver = createResizeObserver;
+});

dist/module/interval-tree.js

@@ -92,5 +92,3 @@ const RED = 0;
   y.P = x.P;
-  if (x.P === NULL_NODE) tree.root = y;else {
-    if (x === x.P.L) x.P.L = y;else x.P.R = y;
-  }
+  if (x.P === NULL_NODE) tree.root = y;else if (x === x.P.L) x.P.L = y;else x.P.R = y;
   y.L = x;
@@ -108,5 +106,3 @@ x.P = y;
   y.P = x.P;
-  if (x.P === NULL_NODE) tree.root = y;else {
-    if (x === x.P.R) x.P.R = y;else x.P.L = y;
-  }
+  if (x.P === NULL_NODE) tree.root = y;else if (x === x.P.R) x.P.R = y;else x.P.L = y;
   y.R = x;
@@ -113,0 +109,0 @@ x.P = y;

dist/module/use-resize-observer.js

@@ -1,2 +0,1 @@
-import { ResizeObserver as Polyfill } from "@juggle/resize-observer";
 import rafSchd from "raf-schd";
@@ -7,3 +6,3 @@ import * as React from "react";
 import { useForceUpdate } from "./use-force-update";
-const ResizeObserver = typeof window !== "undefined" && "ResizeObserver" in window ? window.ResizeObserver : Polyfill;
+
 /**
@@ -15,3 +14,2 @@ * Creates a resize observer that forces updates to the grid cell positions when mutations are
  */
-
 export function useResizeObserver(positioner) {
@@ -18,0 +16,0 @@ const forceUpdate = useForceUpdate();

dist/umd/masonic.js

@@ -1,2 +0,2 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react")):"function"==typeof define&&define.amd?define(["exports","react"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).Masonic={},e.React)}(this,(function(e,t){"use strict";function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function r(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(n){if("default"!==n){var r=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,r.get?r:{enumerable:1,get:function(){return e[n]}})}})),t.default=e,Object.freeze(t)}function i(e){var t=e.high;e.L===ee&&e.R===ee?e.max=t:e.L===ee?e.max=Math.max(e.R.max,t):e.R===ee?e.max=Math.max(e.L.max,t):e.max=Math.max(Math.max(e.L.max,e.R.max),t)}function o(e){for(var t=e;t.P!==ee;)i(t.P),t=t.P}function u(e,t){if(t.R!==ee){var n=t.R;t.R=n.L,n.L!==ee&&(n.L.P=t),n.P=t.P,t.P===ee?e.root=n:t===t.P.L?t.P.L=n:t.P.R=n,n.L=t,t.P=n,i(t),i(n)}}function s(e,t){if(t.L!==ee){var n=t.L;t.L=n.R,n.R!==ee&&(n.R.P=t),n.P=t.P,t.P===ee?e.root=n:t===t.P.R?t.P.R=n:t.P.L=n,n.R=t,t.P=n,i(t),i(n)}}function c(e,t,n){t.P===ee?e.root=n:t===t.P.L?t.P.L=n:t.P.R=n,n.P=t.P}function a(){var e={root:ee,size:0},t={};return{insert:function(n,r,c){for(var a=e.root,f=ee;a!==ee&&n!==(f=a).low;)a=n<a.low?a.L:a.R;if(n===f.low&&f!==ee){if(!function(e,t,n){for(var r,i=e.list;i;){if(i.index===n)return 0;if(t>i.high)break;r=i,i=i.next}return r||(e.list={index:n,high:t,next:i}),r&&(r.next={index:n,high:t,next:r.next}),1}(f,r,c))return;return f.high=Math.max(f.high,r),i(f),o(f),t[c]=f,void e.size++}var l={low:n,high:r,max:r,C:0,P:f,L:ee,R:ee,list:{index:c,high:r,next:null}};f===ee?e.root=l:(l.low<f.low?f.L=l:f.R=l,o(l)),function(e,t){for(var n;0===t.P.C;)t.P===t.P.P.L?0===(n=t.P.P.R).C?(t.P.C=1,n.C=1,t.P.P.C=0,t=t.P.P):(t===t.P.R&&u(e,t=t.P),t.P.C=1,t.P.P.C=0,s(e,t.P.P)):0===(n=t.P.P.L).C?(t.P.C=1,n.C=1,t.P.P.C=0,t=t.P.P):(t===t.P.L&&s(e,t=t.P),t.P.C=1,t.P.P.C=0,u(e,t.P.P));e.root.C=1}(e,l),t[c]=l,e.size++},remove:function(n){var r=t[n];if(void 0!==r){delete t[n];var a=function(e,t){var n=e.list;if(n.index===t)return null===n.next?0:(e.list=n.next,1);var r=n;for(n=n.next;null!==n;){if(n.index===t)return r.next=n.next,1;r=n,n=n.next}}(r,n);if(void 0!==a){if(1===a)return r.high=r.list.high,i(r),o(r),void e.size--;var f,l=r,d=l.C;r.L===ee?(f=r.R,c(e,r,r.R)):r.R===ee?(f=r.L,c(e,r,r.L)):(d=(l=function(e){for(;e.L!==ee;)e=e.L;return e}(r.R)).C,f=l.R,l.P===r?f.P=l:(c(e,l,l.R),l.R=r.R,l.R.P=l),c(e,r,l),l.L=r.L,l.L.P=l,l.C=r.C),i(f),o(f),1===d&&function(e,t){for(var n;t!==ee&&1===t.C;)t===t.P.L?(0===(n=t.P.R).C&&(n.C=1,t.P.C=0,u(e,t.P),n=t.P.R),1===n.L.C&&1===n.R.C?(n.C=0,t=t.P):(1===n.R.C&&(n.L.C=1,n.C=0,s(e,n),n=t.P.R),n.C=t.P.C,t.P.C=1,n.R.C=1,u(e,t.P),t=e.root)):(0===(n=t.P.L).C&&(n.C=1,t.P.C=0,s(e,t.P),n=t.P.L),1===n.R.C&&1===n.L.C?(n.C=0,t=t.P):(1===n.L.C&&(n.R.C=1,n.C=0,u(e,n),n=t.P.L),n.C=t.P.C,t.P.C=1,n.L.C=1,s(e,t.P),t=e.root));t.C=1}(e,f),e.size--}}},search:function(t,n,r){for(var i=[e.root];0!==i.length;){var o=i.pop();if(o!==ee&&t<=o.max&&(o.L!==ee&&i.push(o.L),o.R!==ee&&i.push(o.R),o.low<=n&&o.high>=t))for(var u=o.list;null!==u;)u.high<t||r(u.index,o.low),u=u.next}},get size(){return e.size}}}function f(){return(f=Object.assign||function(e){for(var t=1;arguments.length>t;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e}).apply(this,arguments)}function l(e,t,n,r){var i=Z.useRef(n),o=Z.useRef(r);re((function(){i.current=n,o.current=r})),re((function(){function n(){if(!u){for(var e=arguments.length,t=new Array(e),n=0;e>n;n++)t[n]=arguments[n];i.current.apply(this,t)}}var r=e&&"current"in e?e.current:e;if(r){var u=0;r.addEventListener(t,n);var s=o.current;return function(){u=1,r.removeEventListener(t,n),s&&s()}}}),[e,t])}function d(){var e=Z.useState(ve)[1];return Z.useRef((function(){return e({})})).current}function v(e){var t,n=e.positioner,r=e.resizeObserver,i=e.items,o=e.as,u=void 0===o?"div":o,s=e.id,c=e.className,a=e.style,l=e.role,v=void 0===l?"grid":l,p=e.tabIndex,g=void 0===p?0:p,m=e.containerRef,b=e.itemAs,x=void 0===b?"div":b,w=e.itemStyle,y=e.itemHeightEstimate,P=void 0===y?300:y,R=e.itemKey,T=void 0===R?h:R,C=e.overscanBy,E=void 0===C?2:C,z=e.scrollTop,L=e.isScrolling,S=e.height,M=e.render,O=e.onRender,B=0,k=d(),I=ye(n,r),W=i.length,A=n.columnWidth,N=n.columnCount,H=n.range,j=n.estimateHeight,D=n.size,_=n.shortestColumn,F=D(),X=_(),q=[],G="list"===v?"listitem":"grid"===v?"gridcell":void 0,V=te(O),Y=z+(E*=S),K=Y>X&&W>F;if(H(Math.max(0,z-E/2),Y,(function(e,n,r){var o=i[e],u=T(o,e),s={top:r,left:n,width:A,writingMode:"horizontal-tb",position:"absolute"};q.push(he(x,{key:u,ref:I(e),role:G,style:"object"==typeof w&&null!==w?f({},s,w):s},ge(M,e,o,A))),void 0===t?(B=e,t=e):(B=Math.min(B,e),t=Math.max(t,e))})),K)for(var J=Math.min(W-F,Math.ceil((z+E-X)/P*N)),U=F,Q=we(A);F+J>U;U++){var $=i[U],ee=T($,U);q.push(he(x,{key:ee,ref:I(U),role:G,style:"object"==typeof w?f({},Q,w):Q},ge(M,U,$,A)))}Z.useEffect((function(){"function"==typeof V.current&&void 0!==t&&V.current(B,t,i),pe="1"}),[B,t,i,V]),Z.useEffect((function(){K&&k()}),[K,n]);var ne=me(L,j(W,P));return he(u,{ref:m,key:pe,id:s,role:v,className:c,tabIndex:g,style:"object"==typeof a?xe(ne,a):ne,children:q})}function h(e,t){return t}function p(e,t,n){function r(){u.current=0,c()}void 0===t&&(t=30),void 0===n&&(n=0);var i=te(e),o=1e3/t,u=Z.useRef(0),s=Z.useRef(),c=function(){return s.current&&clearTimeout(s.current)},a=[t,n,i];return Z.useEffect((function(){return r}),a),Z.useCallback((function(){var e=arguments,t=Ie(),r=function(){u.current=t,c(),i.current.apply(null,e)},a=u.current;if(n&&0===a)return r();if(t-a>o){if(a>0)return r();u.current=t}c(),s.current=setTimeout((function(){r(),u.current=0}),o)}),a)}function g(e,t){void 0===e&&(e=0),void 0===t&&(t=12);var n=Ne(t),r=Z.useState(0),i=r[0],o=r[1],u=Z.useRef(0);return Z.useEffect((function(){1===u.current&&o(1);var e,n,r,i,s=0,c=(e=function(){s||o(0)},n=40+1e3/t,r=Ce(),(i={}).v=Se((function t(){Ce()-r<n?i.v=Se(t):e.call(null)})),i);return u.current=1,function(){s=1,function(e){Me(e.v||-1)}(c)}}),[t,n]),{scrollTop:Math.max(0,n-e),isScrolling:i}}function m(e){var t=g(e.offset,e.scrollFps);return v({scrollTop:t.scrollTop,isScrolling:t.isScrolling,positioner:e.positioner,resizeObserver:e.resizeObserver,items:e.items,onRender:e.onRender,as:e.as,id:e.id,className:e.className,style:e.style,role:e.role,tabIndex:e.tabIndex,containerRef:e.containerRef,itemAs:e.itemAs,itemStyle:e.itemStyle,itemHeightEstimate:e.itemHeightEstimate,itemKey:e.itemKey,overscanBy:e.overscanBy,height:e.height,render:e.render})}function b(e,t){void 0===t&&(t=He);var n=Z.useState({offset:0,width:0}),r=n[0],i=n[1];return re((function(){var t=e.current;if(null!==t){var n=0,o=t;do{n+=o.offsetTop||0,o=o.offsetParent}while(o);n===r.offset&&t.offsetWidth===r.width||i({offset:n,width:t.offsetWidth})}}),t),r}function x(e,t){var n=e.width,r=e.columnWidth,i=void 0===r?200:r,o=e.columnGutter,u=void 0===o?0:o,s=e.rowGutter,c=e.columnCount,a=e.maxColumnCount;void 0===t&&(t=Fe);var f=function(){var e=_e(n,i,u,c,a),t=e[0],r=e[1];return je(r,t,u,null!=s?s:u)},l=Z.useRef();void 0===l.current&&(l.current=f());var d=Z.useRef(t),v=[n,i,u,s,c,a],h=Z.useRef(v),p=!v.every((function(e,t){return h.current[t]===e}));if(p||!t.every((function(e,t){return d.current[t]===e}))){var g=l.current,m=f();if(d.current=t,h.current=v,p)for(var b=g.size(),x=0;b>x;x++){var w=g.get(x);m.set(x,void 0!==w?w.height:0)}l.current=m}return l.current}function w(e){return e.activeTargets.length>0}function y(e){return e.skippedTargets.length>0}function P(e,t){this.inlineSize=e,this.blockSize=t,Ye(this)}function R(e,t,n,r){return this.x=e,this.y=t,this.width=n,this.height=r,this.top=this.y,this.left=this.x,this.bottom=this.top+this.height,this.right=this.left+this.width,Ye(this)}function T(){var e=this;return{x:e.x,y:e.y,top:e.top,right:e.right,bottom:e.bottom,left:e.left,width:e.width,height:e.height}}function C(e){return new R(e.x,e.y,e.width,e.height)}function E(e){var t=st(e);this.target=e,this.contentRect=t.contentRect,this.borderBoxSize=Ye([t.borderBoxSize]),this.contentBoxSize=Ye([t.contentBoxSize]),this.devicePixelContentBoxSize=Ye([t.devicePixelContentBoxSize])}function z(e){return e()}function L(){return vt.splice(0).forEach(z)}function S(){var e=this;this.stopped=1,this.listener=function(){return e.schedule()}}function M(e){var t=this;if(void 0===e&&(e=250),!bt){bt=1;var n,r=mt(e);n=function(){var n=0;try{n=function(){var e,t=0;for(dt(t);qe();)t=lt(),dt(t);return Xe.some(y)&&("function"==typeof ErrorEvent?e=new ErrorEvent("error",{message:Ge}):((e=document.createEvent("Event")).initEvent("error",0,0),e.message=Ge),window.dispatchEvent(e)),t>0}()}finally{if(bt=0,e=r-mt(),!ht)return;n?t.run(1e3):e>0?t.run(e):t.start()}},function(){if(!Ve){var e=0,t=document.createTextNode("");new MutationObserver(L).observe(t,{characterData:1}),Ve=function(){t.textContent=""+(e?e--:e++)}}vt.push((function(){requestAnimationFrame(n)})),Ve()}()}}function O(){this.stop(),this.run()}function B(){var e=this,t=function(){return e.observer&&e.observer.observe(document.body,pt)};document.body?t():$e.addEventListener("DOMContentLoaded",t)}function k(){var e=this;this.stopped&&(this.stopped=0,this.observer=new MutationObserver(this.listener),this.observe(),gt.forEach((function(t){return $e.addEventListener(t,e.listener,1)})))}function I(){var e=this;this.stopped||(this.observer&&this.observer.disconnect(),gt.forEach((function(t){return $e.removeEventListener(t,e.listener,1)})),this.stopped=1)}function W(e,t){this.target=e,this.observedBox=t||Be.CONTENT_BOX,this.lastReportedSize={inlineSize:0,blockSize:0}}function A(){var e,t=ct(this.target,this.observedBox,1);return e=this.target,Ue(e)||function(e){switch(e.tagName){case"INPUT":if("image"!==e.type)break;case"VIDEO":case"AUDIO":case"EMBED":case"OBJECT":case"CANVAS":case"IFRAME":case"IMG":return 1}return 0}(e)||"inline"!==getComputedStyle(e).display||(this.lastReportedSize=t),this.lastReportedSize.inlineSize!==t.inlineSize||this.lastReportedSize.blockSize!==t.blockSize?1:0}function N(e,t){this.activeTargets=[],this.skippedTargets=[],this.observationTargets=[],this.observer=e,this.callback=t}function H(){}function j(e,t){var n=new Pt(e,t);Rt.set(e,n)}function D(e,t,n){var r=Rt.get(e),i=0===r.observationTargets.length;0>Tt(r.observationTargets,t)&&(i&&Xe.push(r),r.observationTargets.push(new yt(t,n&&n.box)),wt(1),xt.schedule())}function _(e,t){var n=Rt.get(e),r=Tt(n.observationTargets,t),i=1===n.observationTargets.length;0>r||(i&&Xe.splice(Xe.indexOf(n),1),n.observationTargets.splice(r,1),wt(-1))}function F(e){var t=this,n=Rt.get(e);n.observationTargets.slice().forEach((function(n){return t.unobserve(e,n.target)})),n.activeTargets.splice(0,n.activeTargets.length)}function X(e){if(0===arguments.length)throw new TypeError("Failed to construct 'ResizeObserver': 1 argument required, but only 0 present.");if("function"!=typeof e)throw new TypeError("Failed to construct 'ResizeObserver': The callback provided as parameter 1 is not a function.");Ct.connect(this,e)}function q(e,t){if(0===arguments.length)throw new TypeError("Failed to execute 'observe' on 'ResizeObserver': 1 argument required, but only 0 present.");if(!Ze(e))throw new TypeError("Failed to execute 'observe' on 'ResizeObserver': parameter 1 is not of type 'Element");Ct.observe(this,e,t)}function G(e){if(0===arguments.length)throw new TypeError("Failed to execute 'unobserve' on 'ResizeObserver': 1 argument required, but only 0 present.");if(!Ze(e))throw new TypeError("Failed to execute 'unobserve' on 'ResizeObserver': parameter 1 is not of type 'Element");Ct.unobserve(this,e)}function V(){Ct.disconnect(this)}function Y(){return"function ResizeObserver () { [polyfill code] }"}function K(e){function t(){return r.disconnect()}var n=d(),r=St(e,n);return Z.useEffect((function(){return t}),[r]),r}function J(e){e.cancel()}function U(e,t){var n,r=t.align,i=void 0===r?"top":r,o=t.element,u=void 0===o?"undefined"!=typeof window&&window:o,s=t.offset,c=void 0===s?0:s,a=t.height,f=void 0===a?"undefined"!=typeof window?window.innerHeight:0:a,d=te({positioner:e,element:u,align:i,offset:c,height:f}),v=Z.useRef((function(){var e=d.current.element;return e&&"current"in e?e.current:e})).current,h=Z.useReducer((function(e,t){var n,r={position:e.position,index:e.index,prevTop:e.prevTop};if("scrollToIndex"===t.type)return{position:d.current.positioner.get(null!==(n=t.value)&&void 0!==n?n:-1),index:t.value,prevTop:void 0};if("setPosition"===t.type)r.position=t.value;else if("setPrevTop"===t.type)r.prevTop=t.value;else if("reset"===t.type)return Mt;return r}),Mt),g=h[0],m=h[1],b=p(m,15);l(v(),"scroll",(function(){if(!g.position&&g.index){var e=d.current.positioner.get(g.index);e&&m({type:"setPosition",value:e})}}));var x=void 0!==g.index&&(null===(n=d.current.positioner.get(g.index))||void 0===n?void 0:n.top);return Z.useEffect((function(){var e=v();if(e){var t=d.current,n=t.height,r=t.align,i=t.offset,o=t.positioner;if(g.position){var u=g.position.top;"bottom"===r?u=u-n+g.position.height:"center"===r&&(u-=(n-g.position.height)/2),e.scrollTo(0,Math.max(0,u+=i));var s=0,c=setTimeout((function(){return!s&&m({type:"reset"})}),400);return function(){s=1,clearTimeout(c)}}if(void 0!==g.index){var a=o.shortestColumn()/o.size()*g.index;g.prevTop&&(a=Math.max(a,g.prevTop+n)),e.scrollTo(0,a),b({type:"setPrevTop",value:a})}}}),[x,g,d,v,b]),Z.useRef((function(e){m({type:"scrollToIndex",value:e})})).current}function Q(e){var t=Z.useRef(null),n=function(e){void 0===e&&(e=ie);var t=e,n=t.wait,r=t.leading,i=t.initialWidth,o=void 0===i?0:i,u=t.initialHeight,s=function(e,t,n){var r=Z.useState(e);return[r[0],ne(r[1],t,n)]}("undefined"==typeof document?[o,void 0===u?0:u]:ue,n,r),c=s[0],a=s[1],f=function(){return a(ue)};return l(oe,"resize",f),l(oe,"orientationchange",f),c}({initialWidth:e.ssrWidth,initialHeight:e.ssrHeight}),r=b(t,n),i=f({offset:r.offset,width:r.width||n[0],height:n[1],containerRef:t},e);i.positioner=x(i),i.resizeObserver=K(i.positioner);var o=U(i.positioner,{height:i.height,offset:r.offset,align:"object"==typeof e.scrollToIndex?e.scrollToIndex.align:void 0}),u=e.scrollToIndex&&("number"==typeof e.scrollToIndex?e.scrollToIndex:e.scrollToIndex.index);return Z.useEffect((function(){void 0!==u&&o(u)}),[u,o]),Ot(m,i)}var Z=r(t),$=n(t),ee={low:0,max:0,high:0,C:2,P:void 0,R:void 0,L:void 0,list:void 0};ee.P=ee,ee.L=ee,ee.R=ee;var te=function(e){var t=Z.useRef(e);return Z.useEffect((function(){t.current=e})),t},ne=function(e,t,n){function r(){u.current&&clearTimeout(u.current),u.current=void 0}function i(){u.current=void 0}void 0===t&&(t=100),void 0===n&&(n=0);var o=te(e),u=Z.useRef(),s=[t,n,o];return Z.useEffect((function(){return r}),s),Z.useCallback((function(){var e=arguments,r=u.current;if(void 0===r&&n)return u.current=setTimeout(i,t),o.current.apply(null,e);r&&clearTimeout(r),u.current=setTimeout((function(){u.current=void 0,o.current.apply(null,e)}),t)}),s)},re=$.default["undefined"!=typeof document&&void 0!==document.createElement?"useLayoutEffect":"useEffect"],ie={},oe="undefined"==typeof window?null:window,ue=function(){return[document.documentElement.clientWidth,document.documentElement.clientHeight]},se=function(e,t){var n,r,i=t||ce;return function(){return n&&i(arguments,n)?r:r=e.apply(null,n=arguments)}},ce=function(e,t){return e[0]===t[0]&&e[1]===t[1]&&e[2]===t[2]&&e[3]===t[3]},ae=function(){var e,t;this.set=void 0,this.get=void 0,this.get=function(n){return n===e?t:void 0},this.set=function(n,r){e=n,t=r}},fe=function(e){try{return new e}catch(e){var t={};return{set:function(e,n){t[e]=n},get:function(e){return t[e]}}}},le=function(e,t){var n,r,i,o,u,s,c,a,f,l=(c=(r=e).length,a=fe(r[0]),f=1===c,3>c?{g:function(e){return void 0===(i=a.get(e[0]))||f?i:i.get(e[1])},s:function(e,t){return f?a.set(e[0],t):void 0===(i=a.get(e[0]))?((o=fe(r[1])).set(e[1],t),a.set(e[0],o)):i.set(e[1],t),t}}:{g:function(e){for(s=a,u=0;c>u;u++)if(void 0===(s=s.get(e[u])))return;return s},s:function(e,t){for(s=a,u=0;c-1>u;u++)void 0===(o=s.get(e[u]))?(o=fe(r[u+1]),s.set(e[u],o),s=o):s=o;return s.set(e[c-1],t),t}}),d=l.g,v=l.s;return function(){return void 0===(n=d(arguments))?v(arguments,t.apply(null,arguments)):n}},de=new WeakMap,ve={},he=Z.createElement,pe="0",ge=le([ae,{},WeakMap,ae],(function(e,t,n,r){return he(e,{index:t,data:n,width:r})})),me=se((function(e,t){return{position:"relative",width:"100%",maxWidth:"100%",height:Math.ceil(t),maxHeight:Math.ceil(t),willChange:e?"contents":void 0,pointerEvents:e?"none":void 0}})),be=function(e,t){return e[0]===t[0]&&e[1]===t[1]},xe=se((function(e,t){return f({},e,t)}),be),we=se((function(e){return{width:e,zIndex:-1e3,visibility:"hidden",position:"absolute",writingMode:"horizontal-tb"}}),(function(e,t){return e[0]===t[0]})),ye=se((function(e,t){return function(n){return function(r){null!==r&&(t&&(t.observe(r),de.set(r,n)),void 0===e.get(n)&&e.set(n,r.offsetHeight))}}}),be),Pe="undefined",Re=typeof window!==Pe?window:{},Te=typeof performance!==Pe?performance:Date,Ce=function(){return Te.now()},Ee="AnimationFrame",ze="cancel"+Ee,Le="request"+Ee,Se=Re[Le]&&Re[Le].bind(Re),Me=Re[ze]&&Re[ze].bind(Re);if(!Se||!Me){var Oe=0;Se=function(e){var t=Ce(),n=Math.max(Oe+1e3/60,t);return setTimeout((function(){e(Oe=n)}),n-t)},Me=function(e){return clearTimeout(e)}}var Be,ke="undefined"!=typeof performance?performance:Date,Ie=function(){return ke.now()},We="undefined"==typeof window?null:window,Ae=function(){return void 0!==We.scrollY?We.scrollY:void 0===We.pageYOffset?0:We.pageYOffset},Ne=function(e){void 0===e&&(e=30);var t=function(e,t){var n=Z.useState(e);return[n[0],p(n[1],t,1)]}("undefined"==typeof window?0:Ae,e);return l(We,"scroll",(function(){return t[1](Ae())})),t[0]},He=[],je=function(e,t,n,r){void 0===n&&(n=0),void 0===r&&(r=n);for(var i=a(),o=new Array(e),u=[],s=new Array(e),c=0;e>c;c++)o[c]=0,s[c]=[];return{columnCount:e,columnWidth:t,set:function(e,c){void 0===c&&(c=0);for(var a=0,f=1;f<o.length;f++)o[f]<o[a]&&(a=f);var l=o[a]||0;o[a]=l+c+r,s[a].push(e),u[e]={left:a*(t+n),top:l,height:c,column:a},i.insert(l,l+c,e)},get:function(e){return u[e]},update:function(t){for(var n=new Array(e),c=0,a=0;c<t.length-1;c++){var f=t[c],l=u[f];l.height=t[++c],i.remove(f),i.insert(l.top,l.top+l.height,f),n[l.column]=void 0===n[l.column]?f:Math.min(f,n[l.column])}for(c=0;c<n.length;c++)if(void 0!==n[c]){var d=s[c],v=De(d,n[c]),h=s[c][v],p=u[h];for(o[c]=p.top+p.height+r,a=v+1;a<d.length;a++){var g=d[a],m=u[g];m.top=o[c],o[c]=m.top+m.height+r,i.remove(g),i.insert(m.top,m.top+m.height,g)}}},range:function(e,t,n){return i.search(e,t,(function(e,t){return n(e,u[e].left,t)}))},estimateHeight:function(t,n){var r=Math.max(0,Math.max.apply(null,o));return t===i.size?r:r+Math.ceil((t-i.size)/e)*n},shortestColumn:function(){return o.length>1?Math.min.apply(null,o):o[0]||0},size:function(){return i.size},all:function(){return u}}},De=function(e,t){for(var n=0,r=e.length-1;r>=n;){var i=n+r>>>1,o=e[i];if(o===t)return i;o>t?r=i-1:n=i+1}return-1},_e=function(e,t,n,r,i){return void 0===e&&(e=0),void 0===t&&(t=0),void 0===n&&(n=8),r=r||Math.min(Math.floor((e+n)/(t+n)),i||1/0)||1,[Math.floor((e-n*(r-1))/r),r]},Fe=[],Xe=[],qe=function(){return Xe.some(w)},Ge="ResizeObserver loop completed with undelivered notifications.";!function(e){e.BORDER_BOX="border-box",e.CONTENT_BOX="content-box",e.DEVICE_PIXEL_CONTENT_BOX="device-pixel-content-box"}(Be||(Be={}));var Ve,Ye=function(e){return Object.freeze(e)},Ke=function(){return P}(),Je=function(){return R.prototype.toJSON=T,R.fromRect=C,R}(),Ue=function(e){return e instanceof SVGElement&&"getBBox"in e},Qe=function(e){if(Ue(e)){var t=e.getBBox(),n=t.width,r=t.height;return!n&&!r}var i=e,o=i.offsetWidth,u=i.offsetHeight;return!(o||u||e.getClientRects().length)},Ze=function(e){var t,n;if(e instanceof Element)return 1;var r=null===(n=null===(t=e)||void 0===t?void 0:t.ownerDocument)||void 0===n?void 0:n.defaultView;return!!(r&&e instanceof r.Element)},$e="undefined"!=typeof window?window:{},et=new WeakMap,tt=/auto|scroll/,nt=/^tb|vertical/,rt=/msie|trident/i.test($e.navigator&&$e.navigator.userAgent),it=function(e){return parseFloat(e||"0")},ot=function(e,t,n){return void 0===e&&(e=0),void 0===t&&(t=0),void 0===n&&(n=0),new Ke((n?t:e)||0,(n?e:t)||0)},ut=Ye({devicePixelContentBoxSize:ot(),borderBoxSize:ot(),contentBoxSize:ot(),contentRect:new Je(0,0,0,0)}),st=function(e,t){if(void 0===t&&(t=0),et.has(e)&&!t)return et.get(e);if(Qe(e))return et.set(e,ut),ut;var n=getComputedStyle(e),r=Ue(e)&&e.ownerSVGElement&&e.getBBox(),i=!rt&&"border-box"===n.boxSizing,o=nt.test(n.writingMode||""),u=!r&&tt.test(n.overflowY||""),s=!r&&tt.test(n.overflowX||""),c=r?0:it(n.paddingTop),a=r?0:it(n.paddingRight),f=r?0:it(n.paddingBottom),l=r?0:it(n.paddingLeft),d=r?0:it(n.borderTopWidth),v=r?0:it(n.borderRightWidth),h=r?0:it(n.borderBottomWidth),p=l+a,g=c+f,m=(r?0:it(n.borderLeftWidth))+v,b=d+h,x=s?e.offsetHeight-b-e.clientHeight:0,w=u?e.offsetWidth-m-e.clientWidth:0,y=i?p+m:0,P=i?g+b:0,R=r?r.width:it(n.width)-y-w,T=r?r.height:it(n.height)-P-x,C=R+p+w+m,E=T+g+x+b,z=Ye({devicePixelContentBoxSize:ot(Math.round(R*devicePixelRatio),Math.round(T*devicePixelRatio),o),borderBoxSize:ot(C,E,o),contentBoxSize:ot(R,T,o),contentRect:new Je(l,c,R,T)});return et.set(e,z),z},ct=function(e,t,n){var r=st(e,n),i=r.borderBoxSize,o=r.contentBoxSize,u=r.devicePixelContentBoxSize;switch(t){case Be.DEVICE_PIXEL_CONTENT_BOX:return u;case Be.BORDER_BOX:return i;default:return o}},at=function(){return E}(),ft=function(e){if(Qe(e))return 1/0;for(var t=0,n=e.parentNode;n;)t+=1,n=n.parentNode;return t},lt=function(){var e=1/0,t=[];Xe.forEach((function(n){if(0!==n.activeTargets.length){var r=[];n.activeTargets.forEach((function(t){var n=new at(t.target),i=ft(t.target);r.push(n),t.lastReportedSize=ct(t.target,t.observedBox),e>i&&(e=i)})),t.push((function(){n.callback.call(n.observer,r,n.observer)})),n.activeTargets.splice(0,n.activeTargets.length)}}));for(var n=0,r=t;n<r.length;n++)(0,r[n])();return e},dt=function(e){Xe.forEach((function(t){t.activeTargets.splice(0,t.activeTargets.length),t.skippedTargets.splice(0,t.skippedTargets.length),t.observationTargets.forEach((function(n){n.isActive()&&(ft(n.target)>e?t.activeTargets.push(n):t.skippedTargets.push(n))}))}))},vt=[],ht=0,pt={attributes:1,characterData:1,childList:1,subtree:1},gt=["resize","load","transitionend","animationend","animationstart","animationiteration","keyup","keydown","mouseup","mousedown","mouseover","mouseout","blur","focus"],mt=function(e){return void 0===e&&(e=0),Date.now()+e},bt=0,xt=new(function(){return S.prototype.run=M,S.prototype.schedule=O,S.prototype.observe=B,S.prototype.start=k,S.prototype.stop=I,S}()),wt=function(e){!ht&&e>0&&xt.start(),!(ht+=e)&&xt.stop()},yt=function(){return W.prototype.isActive=A,W}(),Pt=function(){return N}(),Rt=new WeakMap,Tt=function(e,t){for(var n=0;n<e.length;n+=1)if(e[n].target===t)return n;return-1},Ct=function(){return H.connect=j,H.observe=D,H.unobserve=_,H.disconnect=F,H}(),Et=function(){return X.prototype.observe=q,X.prototype.unobserve=G,X.prototype.disconnect=V,X.toString=Y,X}(),zt=function(e){function t(){r=null,e.apply(void 0,n)}var n=[],r=null,i=function(){for(var e=arguments.length,i=new Array(e),o=0;e>o;o++)i[o]=arguments[o];n=i,r||(r=requestAnimationFrame(t))};return i.cancel=function(){r&&(cancelAnimationFrame(r),r=null)},i},Lt="undefined"!=typeof window&&"ResizeObserver"in window?window.ResizeObserver:Et,St=le([WeakMap],(function(e,t){var n=[],r=zt((function(){n.length>0&&(e.update(n),t(n)),n.length=0})),i=function(t){var i=t.offsetHeight;if(i>0){var o=de.get(t);if(void 0!==o){var u=e.get(o);void 0!==u&&i!==u.height&&n.push(o,i)}}r()},o=new Map,u=new Lt((function(e){for(var t=0;t<e.length;t++){var n=e[t],r=de.get(n.target);if(void 0!==r){var u=o.get(r);u||(u=zt(i),o.set(r,u)),u(n.target)}}})),s=u.disconnect.bind(u);return u.disconnect=function(){s(),o.forEach(J)},u})),Mt={index:void 0,position:void 0,prevTop:void 0},Ot=Z.createElement,Bt=Z.createElement,kt=function(e,t){return void 0!==t[e]},It={};e.List=function(e){return Bt(Q,f({role:"list",rowGutter:e.rowGutter,columnCount:1,columnWidth:1},e))},e.Masonry=Q,e.MasonryScroller=m,e.createIntervalTree=a,e.createPositioner=je,e.createResizeObserver=St,e.useContainerPosition=b,e.useInfiniteLoader=function(e,t){void 0===t&&(t=It);var n=t,r=n.isItemLoaded,i=n.minimumBatchSize,o=void 0===i?16:i,u=n.threshold,s=void 0===u?16:u,c=n.totalItems,a=void 0===c?9e9:c,f=te(e),l=te(r);return Z.useCallback((function(e,t,n){for(var r=function(e,t,n,r,i,o){void 0===e&&(e=kt),void 0===t&&(t=16),void 0===r&&(r=9e9);for(var u,s,c=[],a=i;o>=a;a++)e(a,n)?void 0!==u&&void 0!==s&&(c.push(u,s),u=s=void 0):(s=a,void 0===u&&(u=a));if(void 0!==u&&void 0!==s){var f=Math.min(Math.max(s,u+t-1),r-1);for(a=s+1;f>=a&&!e(a,n);a++)s=a;c.push(u,s)}if(c.length)for(var l=c[0],d=c[1];t>d-l+1&&l>0;){var v=l-1;if(e(v,n))break;c[0]=l=v}return c}(l.current,o,n,a,Math.max(0,e-s),Math.min(a-1,(t||0)+s)),i=0;i<r.length-1;++i)f.current(r[i],r[++i],n)}),[a,o,s,f,l])},e.useMasonry=v,e.usePositioner=x,e.useResizeObserver=K,e.useScrollToIndex=U,e.useScroller=g,Object.defineProperty(e,"__esModule",{value:1})}));
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react")):"function"==typeof define&&define.amd?define(["exports","react"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).Masonic={},e.React)}(this,(function(e,t){"use strict";function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function r(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(n){if("default"!==n){var r=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,r.get?r:{enumerable:1,get:function(){return e[n]}})}})),t.default=e,Object.freeze(t)}function i(e){var t=e.high;e.L===M&&e.R===M?e.max=t:e.L===M?e.max=Math.max(e.R.max,t):e.R===M?e.max=Math.max(e.L.max,t):e.max=Math.max(Math.max(e.L.max,e.R.max),t)}function o(e){for(var t=e;t.P!==M;)i(t.P),t=t.P}function u(e,t){if(t.R!==M){var n=t.R;t.R=n.L,n.L!==M&&(n.L.P=t),n.P=t.P,t.P===M?e.root=n:t===t.P.L?t.P.L=n:t.P.R=n,n.L=t,t.P=n,i(t),i(n)}}function f(e,t){if(t.L!==M){var n=t.L;t.L=n.R,n.R!==M&&(n.R.P=t),n.P=t.P,t.P===M?e.root=n:t===t.P.R?t.P.R=n:t.P.L=n,n.R=t,t.P=n,i(t),i(n)}}function c(e,t,n){t.P===M?e.root=n:t===t.P.L?t.P.L=n:t.P.R=n,n.P=t.P}function a(){var e={root:M,size:0},t={};return{insert:function(n,r,c){for(var a=e.root,s=M;a!==M&&n!==(s=a).low;)a=n<a.low?a.L:a.R;if(n===s.low&&s!==M){if(!function(e,t,n){for(var r,i=e.list;i;){if(i.index===n)return 0;if(t>i.high)break;r=i,i=i.next}return r||(e.list={index:n,high:t,next:i}),r&&(r.next={index:n,high:t,next:r.next}),1}(s,r,c))return;return s.high=Math.max(s.high,r),i(s),o(s),t[c]=s,void e.size++}var l={low:n,high:r,max:r,C:0,P:s,L:M,R:M,list:{index:c,high:r,next:null}};s===M?e.root=l:(l.low<s.low?s.L=l:s.R=l,o(l)),function(e,t){for(var n;0===t.P.C;)t.P===t.P.P.L?0===(n=t.P.P.R).C?(t.P.C=1,n.C=1,t.P.P.C=0,t=t.P.P):(t===t.P.R&&u(e,t=t.P),t.P.C=1,t.P.P.C=0,f(e,t.P.P)):0===(n=t.P.P.L).C?(t.P.C=1,n.C=1,t.P.P.C=0,t=t.P.P):(t===t.P.L&&f(e,t=t.P),t.P.C=1,t.P.P.C=0,u(e,t.P.P));e.root.C=1}(e,l),t[c]=l,e.size++},remove:function(n){var r=t[n];if(void 0!==r){delete t[n];var a=function(e,t){var n=e.list;if(n.index===t)return null===n.next?0:(e.list=n.next,1);var r=n;for(n=n.next;null!==n;){if(n.index===t)return r.next=n.next,1;r=n,n=n.next}}(r,n);if(void 0!==a){if(1===a)return r.high=r.list.high,i(r),o(r),void e.size--;var s,l=r,v=l.C;r.L===M?(s=r.R,c(e,r,r.R)):r.R===M?(s=r.L,c(e,r,r.L)):(v=(l=function(e){for(;e.L!==M;)e=e.L;return e}(r.R)).C,s=l.R,l.P===r?s.P=l:(c(e,l,l.R),l.R=r.R,l.R.P=l),c(e,r,l),l.L=r.L,l.L.P=l,l.C=r.C),i(s),o(s),1===v&&function(e,t){for(var n;t!==M&&1===t.C;)t===t.P.L?(0===(n=t.P.R).C&&(n.C=1,t.P.C=0,u(e,t.P),n=t.P.R),1===n.L.C&&1===n.R.C?(n.C=0,t=t.P):(1===n.R.C&&(n.L.C=1,n.C=0,f(e,n),n=t.P.R),n.C=t.P.C,t.P.C=1,n.R.C=1,u(e,t.P),t=e.root)):(0===(n=t.P.L).C&&(n.C=1,t.P.C=0,f(e,t.P),n=t.P.L),1===n.R.C&&1===n.L.C?(n.C=0,t=t.P):(1===n.L.C&&(n.R.C=1,n.C=0,u(e,n),n=t.P.L),n.C=t.P.C,t.P.C=1,n.L.C=1,f(e,t.P),t=e.root));t.C=1}(e,s),e.size--}}},search:function(t,n,r){for(var i=[e.root];0!==i.length;){var o=i.pop();if(o!==M&&t<=o.max&&(o.L!==M&&i.push(o.L),o.R!==M&&i.push(o.R),o.low<=n&&o.high>=t))for(var u=o.list;null!==u;)u.high<t||r(u.index,o.low),u=u.next}},get size(){return e.size}}}function s(){return(s=Object.assign||function(e){for(var t=1;arguments.length>t;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e}).apply(this,arguments)}function l(e,t,n,r){var i=L.useRef(n),o=L.useRef(r);L.useEffect((function(){i.current=n,o.current=r})),L.useEffect((function(){function n(){if(!u){for(var e=arguments.length,t=new Array(e),n=0;e>n;n++)t[n]=arguments[n];i.current.apply(this,t)}}var r=e&&"current"in e?e.current:e;if(r){var u=0;r.addEventListener(t,n);var f=o.current;return function(){u=1,r.removeEventListener(t,n),f&&f()}}}),[e,t])}function v(){var e=L.useState(F)[1];return L.useRef((function(){return e({})})).current}function d(e){var t,n=e.positioner,r=e.resizeObserver,i=e.items,o=e.as,u=void 0===o?"div":o,f=e.id,c=e.className,a=e.style,l=e.role,d=void 0===l?"grid":l,p=e.tabIndex,m=void 0===p?0:p,g=e.containerRef,P=e.itemAs,x=void 0===P?"div":P,y=e.itemStyle,R=e.itemHeightEstimate,w=void 0===R?300:R,C=e.itemKey,b=void 0===C?h:C,M=e.overscanBy,z=void 0===M?2:M,E=e.scrollTop,O=e.isScrolling,I=e.height,S=e.render,j=e.onRender,W=0,H=v(),k=V(n,r),A=i.length,B=n.columnWidth,F=n.columnCount,q=n.range,J=n.estimateHeight,Q=n.size,U=n.shortestColumn,X=Q(),Z=U(),$=[],ee="list"===d?"listitem":"grid"===d?"gridcell":void 0,te=T(j),ne=E+(z*=I),re=ne>Z&&A>X;if(q(Math.max(0,E-z/2),ne,(function(e,n,r){var o=i[e],u=b(o,e),f={top:r,left:n,width:B,writingMode:"horizontal-tb",position:"absolute"};$.push(G(x,{key:u,ref:k(e),role:ee,style:"object"==typeof y&&null!==y?s({},f,y):f},Y(S,e,o,B))),void 0===t?(W=e,t=e):(W=Math.min(W,e),t=Math.max(t,e))})),re)for(var ie=Math.min(A-X,Math.ceil((E+z-Z)/w*F)),oe=X,ue=K(B);X+ie>oe;oe++){var fe=i[oe],ce=b(fe,oe);$.push(G(x,{key:ce,ref:k(oe),role:ee,style:"object"==typeof y?s({},ue,y):ue},Y(S,oe,fe,B)))}L.useEffect((function(){"function"==typeof te.current&&void 0!==t&&te.current(W,t,i),N="1"}),[W,t,i,te]),L.useEffect((function(){re&&H()}),[re,n]);var ae=_(O,J(A,w));return G(u,{ref:g,key:N,id:f,role:d,className:c,tabIndex:m,style:"object"==typeof a?D(ae,a):ae,children:$})}function h(e,t){return t}function p(e,t,n){function r(){u.current=0,c()}void 0===t&&(t=30),void 0===n&&(n=0);var i=T(e),o=1e3/t,u=L.useRef(0),f=L.useRef(),c=function(){return f.current&&clearTimeout(f.current)},a=[t,n,i];return L.useEffect((function(){return r}),a),L.useCallback((function(){var e=arguments,t=oe(),r=function(){u.current=t,c(),i.current.apply(null,e)},a=u.current;if(n&&0===a)return r();if(t-a>o){if(a>0)return r();u.current=t}c(),f.current=setTimeout((function(){r(),u.current=0}),o)}),a)}function m(e,t){void 0===e&&(e=0),void 0===t&&(t=12);var n=ce(t),r=L.useState(0),i=r[0],o=r[1],u=L.useRef(0);return L.useEffect((function(){1===u.current&&o(1);var e,n,r,i,f=0,c=(e=function(){f||o(0)},n=40+1e3/t,r=X(),(i={}).v=te((function t(){X()-r<n?i.v=te(t):e.call(null)})),i);return u.current=1,function(){f=1,function(e){ne(e.v||-1)}(c)}}),[t,n]),{scrollTop:Math.max(0,n-e),isScrolling:i}}function g(e){var t=m(e.offset,e.scrollFps);return d({scrollTop:t.scrollTop,isScrolling:t.isScrolling,positioner:e.positioner,resizeObserver:e.resizeObserver,items:e.items,onRender:e.onRender,as:e.as,id:e.id,className:e.className,style:e.style,role:e.role,tabIndex:e.tabIndex,containerRef:e.containerRef,itemAs:e.itemAs,itemStyle:e.itemStyle,itemHeightEstimate:e.itemHeightEstimate,itemKey:e.itemKey,overscanBy:e.overscanBy,height:e.height,render:e.render})}function P(e,t){void 0===t&&(t=se);var n=L.useState({offset:0,width:0}),r=n[0],i=n[1];return ae((function(){var t=e.current;if(null!==t){var n=0,o=t;do{n+=o.offsetTop||0,o=o.offsetParent}while(o);n===r.offset&&t.offsetWidth===r.width||i({offset:n,width:t.offsetWidth})}}),t),r}function x(e,t){var n=e.width,r=e.columnWidth,i=void 0===r?200:r,o=e.columnGutter,u=void 0===o?0:o,f=e.rowGutter,c=e.columnCount,a=e.maxColumnCount;void 0===t&&(t=he);var s=function(){var e=de(n,i,u,c,a),t=e[0],r=e[1];return le(r,t,u,null!=f?f:u)},l=L.useRef();void 0===l.current&&(l.current=s());var v=L.useRef(t),d=[n,i,u,f,c,a],h=L.useRef(d),p=!d.every((function(e,t){return h.current[t]===e}));if(p||!t.every((function(e,t){return v.current[t]===e}))){var m=l.current,g=s();if(v.current=t,h.current=d,p)for(var P=m.size(),x=0;P>x;x++){var y=m.get(x);g.set(x,void 0!==y?y.height:0)}l.current=g}return l.current}function y(e){function t(){return r.disconnect()}var n=v(),r=me(e,n);return L.useEffect((function(){return t}),[r]),r}function R(e){e.cancel()}function w(e,t){var n,r=t.align,i=void 0===r?"top":r,o=t.element,u=void 0===o?"undefined"!=typeof window&&window:o,f=t.offset,c=void 0===f?0:f,a=t.height,s=void 0===a?"undefined"!=typeof window?window.innerHeight:0:a,v=T({positioner:e,element:u,align:i,offset:c,height:s}),d=L.useRef((function(){var e=v.current.element;return e&&"current"in e?e.current:e})).current,h=L.useReducer((function(e,t){var n,r={position:e.position,index:e.index,prevTop:e.prevTop};if("scrollToIndex"===t.type)return{position:v.current.positioner.get(null!==(n=t.value)&&void 0!==n?n:-1),index:t.value,prevTop:void 0};if("setPosition"===t.type)r.position=t.value;else if("setPrevTop"===t.type)r.prevTop=t.value;else if("reset"===t.type)return ge;return r}),ge),m=h[0],g=h[1],P=p(g,15);l(d(),"scroll",(function(){if(!m.position&&m.index){var e=v.current.positioner.get(m.index);e&&g({type:"setPosition",value:e})}}));var x=void 0!==m.index&&(null===(n=v.current.positioner.get(m.index))||void 0===n?void 0:n.top);return L.useEffect((function(){var e=d();if(e){var t=v.current,n=t.height,r=t.align,i=t.offset,o=t.positioner;if(m.position){var u=m.position.top;"bottom"===r?u=u-n+m.position.height:"center"===r&&(u-=(n-m.position.height)/2),e.scrollTo(0,Math.max(0,u+=i));var f=0,c=setTimeout((function(){return!f&&g({type:"reset"})}),400);return function(){f=1,clearTimeout(c)}}if(void 0!==m.index){var a=o.shortestColumn()/o.size()*m.index;m.prevTop&&(a=Math.max(a,m.prevTop+n)),e.scrollTo(0,a),P({type:"setPrevTop",value:a})}}}),[x,m,v,d,P]),L.useRef((function(e){g({type:"scrollToIndex",value:e})})).current}function C(e){var t=L.useRef(null),n=function(e){void 0===e&&(e=E);var t=e,n=t.wait,r=t.leading,i=t.initialWidth,o=void 0===i?0:i,u=t.initialHeight,f=function(e,t,n){var r=L.useState(e);return[r[0],z(r[1],t,n)]}("undefined"==typeof document?[o,void 0===u?0:u]:S,n,r),c=f[0],a=f[1],s=function(){return a(S)};return l(O,"resize",s),l(I,"resize",s),l(O,"orientationchange",s),c}({initialWidth:e.ssrWidth,initialHeight:e.ssrHeight}),r=P(t,n),i=s({offset:r.offset,width:r.width||n[0],height:n[1],containerRef:t},e);i.positioner=x(i),i.resizeObserver=y(i.positioner);var o=w(i.positioner,{height:i.height,offset:r.offset,align:"object"==typeof e.scrollToIndex?e.scrollToIndex.align:void 0}),u=e.scrollToIndex&&("number"==typeof e.scrollToIndex?e.scrollToIndex:e.scrollToIndex.index);return L.useEffect((function(){void 0!==u&&o(u)}),[u,o]),Pe(g,i)}var L=r(t),b=n(t),M={low:0,max:0,high:0,C:2,P:void 0,R:void 0,L:void 0,list:void 0};M.P=M,M.L=M,M.R=M;var T=function(e){var t=L.useRef(e);return L.useEffect((function(){t.current=e})),t},z=function(e,t,n){function r(){u.current&&clearTimeout(u.current),u.current=void 0}function i(){u.current=void 0}void 0===t&&(t=100),void 0===n&&(n=0);var o=T(e),u=L.useRef(),f=[t,n,o];return L.useEffect((function(){return r}),f),L.useCallback((function(){var e=arguments,r=u.current;if(void 0===r&&n)return u.current=setTimeout(i,t),o.current.apply(null,e);r&&clearTimeout(r),u.current=setTimeout((function(){u.current=void 0,o.current.apply(null,e)}),t)}),f)},E={},O="undefined"==typeof window?null:window,I=O&&void 0!==O.visualViewport?O.visualViewport:null,S=function(){return[document.documentElement.clientWidth,document.documentElement.clientHeight]},j=function(e,t){var n,r,i=t||W;return function(){return n&&i(arguments,n)?r:r=e.apply(null,n=arguments)}},W=function(e,t){return e[0]===t[0]&&e[1]===t[1]&&e[2]===t[2]&&e[3]===t[3]},H=function(){var e,t;this.set=void 0,this.get=void 0,this.get=function(n){return n===e?t:void 0},this.set=function(n,r){e=n,t=r}},k=function(e){try{return new e}catch(e){var t={};return{set:function(e,n){t[e]=n},get:function(e){return t[e]}}}},A=function(e,t){var n,r,i,o,u,f,c,a,s,l=(c=(r=e).length,a=k(r[0]),s=1===c,3>c?{g:function(e){return void 0===(i=a.get(e[0]))||s?i:i.get(e[1])},s:function(e,t){return s?a.set(e[0],t):void 0===(i=a.get(e[0]))?((o=k(r[1])).set(e[1],t),a.set(e[0],o)):i.set(e[1],t),t}}:{g:function(e){for(f=a,u=0;c>u;u++)if(void 0===(f=f.get(e[u])))return;return f},s:function(e,t){for(f=a,u=0;c-1>u;u++)void 0===(o=f.get(e[u]))?(o=k(r[u+1]),f.set(e[u],o),f=o):f=o;return f.set(e[c-1],t),t}}),v=l.g,d=l.s;return function(){return void 0===(n=v(arguments))?d(arguments,t.apply(null,arguments)):n}},B=new WeakMap,F={},G=L.createElement,N="0",Y=A([H,{},WeakMap,H],(function(e,t,n,r){return G(e,{index:t,data:n,width:r})})),_=j((function(e,t){return{position:"relative",width:"100%",maxWidth:"100%",height:Math.ceil(t),maxHeight:Math.ceil(t),willChange:e?"contents":void 0,pointerEvents:e?"none":void 0}})),q=function(e,t){return e[0]===t[0]&&e[1]===t[1]},D=j((function(e,t){return s({},e,t)}),q),K=j((function(e){return{width:e,zIndex:-1e3,visibility:"hidden",position:"absolute",writingMode:"horizontal-tb"}}),(function(e,t){return e[0]===t[0]})),V=j((function(e,t){return function(n){return function(r){null!==r&&(t&&(t.observe(r),B.set(r,n)),void 0===e.get(n)&&e.set(n,r.offsetHeight))}}}),q),J="undefined",Q=typeof window!==J?window:{},U=typeof performance!==J?performance:Date,X=function(){return U.now()},Z="AnimationFrame",$="cancel"+Z,ee="request"+Z,te=Q[ee]&&Q[ee].bind(Q),ne=Q[$]&&Q[$].bind(Q);if(!te||!ne){var re=0;te=function(e){var t=X(),n=Math.max(re+1e3/60,t);return setTimeout((function(){e(re=n)}),n-t)},ne=function(e){return clearTimeout(e)}}var ie="undefined"!=typeof performance?performance:Date,oe=function(){return ie.now()},ue="undefined"==typeof window?null:window,fe=function(){return void 0!==ue.scrollY?ue.scrollY:void 0===ue.pageYOffset?0:ue.pageYOffset},ce=function(e){void 0===e&&(e=30);var t=function(e,t){var n=L.useState(e);return[n[0],p(n[1],t,1)]}("undefined"==typeof window?0:fe,e);return l(ue,"scroll",(function(){return t[1](fe())})),t[0]},ae=b.default["undefined"!=typeof document&&void 0!==document.createElement?"useLayoutEffect":"useEffect"],se=[],le=function(e,t,n,r){void 0===n&&(n=0),void 0===r&&(r=n);for(var i=a(),o=new Array(e),u=[],f=new Array(e),c=0;e>c;c++)o[c]=0,f[c]=[];return{columnCount:e,columnWidth:t,set:function(e,c){void 0===c&&(c=0);for(var a=0,s=1;s<o.length;s++)o[s]<o[a]&&(a=s);var l=o[a]||0;o[a]=l+c+r,f[a].push(e),u[e]={left:a*(t+n),top:l,height:c,column:a},i.insert(l,l+c,e)},get:function(e){return u[e]},update:function(t){for(var n=new Array(e),c=0,a=0;c<t.length-1;c++){var s=t[c],l=u[s];l.height=t[++c],i.remove(s),i.insert(l.top,l.top+l.height,s),n[l.column]=void 0===n[l.column]?s:Math.min(s,n[l.column])}for(c=0;c<n.length;c++)if(void 0!==n[c]){var v=f[c],d=ve(v,n[c]),h=f[c][d],p=u[h];for(o[c]=p.top+p.height+r,a=d+1;a<v.length;a++){var m=v[a],g=u[m];g.top=o[c],o[c]=g.top+g.height+r,i.remove(m),i.insert(g.top,g.top+g.height,m)}}},range:function(e,t,n){return i.search(e,t,(function(e,t){return n(e,u[e].left,t)}))},estimateHeight:function(t,n){var r=Math.max(0,Math.max.apply(null,o));return t===i.size?r:r+Math.ceil((t-i.size)/e)*n},shortestColumn:function(){return o.length>1?Math.min.apply(null,o):o[0]||0},size:function(){return i.size},all:function(){return u}}},ve=function(e,t){for(var n=0,r=e.length-1;r>=n;){var i=n+r>>>1,o=e[i];if(o===t)return i;o>t?r=i-1:n=i+1}return-1},de=function(e,t,n,r,i){return void 0===e&&(e=0),void 0===t&&(t=0),void 0===n&&(n=8),r=r||Math.min(Math.floor((e+n)/(t+n)),i||1/0)||1,[Math.floor((e-n*(r-1))/r),r]},he=[],pe=function(e){function t(){r=null,e.apply(void 0,n)}var n=[],r=null,i=function(){for(var e=arguments.length,i=new Array(e),o=0;e>o;o++)i[o]=arguments[o];n=i,r||(r=requestAnimationFrame(t))};return i.cancel=function(){r&&(cancelAnimationFrame(r),r=null)},i},me=A([WeakMap],(function(e,t){var n=[],r=pe((function(){n.length>0&&(e.update(n),t(n)),n.length=0})),i=function(t){var i=t.offsetHeight;if(i>0){var o=B.get(t);if(void 0!==o){var u=e.get(o);void 0!==u&&i!==u.height&&n.push(o,i)}}r()},o=new Map,u=new ResizeObserver((function(e){for(var t=0;t<e.length;t++){var n=e[t],r=B.get(n.target);if(void 0!==r){var u=o.get(r);u||(u=pe(i),o.set(r,u)),u(n.target)}}})),f=u.disconnect.bind(u);return u.disconnect=function(){f(),o.forEach(R)},u})),ge={index:void 0,position:void 0,prevTop:void 0},Pe=L.createElement,xe=L.createElement,ye=function(e,t){return void 0!==t[e]},Re={};e.List=function(e){return xe(C,s({role:"list",rowGutter:e.rowGutter,columnCount:1,columnWidth:1},e))},e.Masonry=C,e.MasonryScroller=g,e.createIntervalTree=a,e.createPositioner=le,e.createResizeObserver=me,e.useContainerPosition=P,e.useInfiniteLoader=function(e,t){void 0===t&&(t=Re);var n=t,r=n.isItemLoaded,i=n.minimumBatchSize,o=void 0===i?16:i,u=n.threshold,f=void 0===u?16:u,c=n.totalItems,a=void 0===c?9e9:c,s=T(e),l=T(r);return L.useCallback((function(e,t,n){for(var r=function(e,t,n,r,i,o){void 0===e&&(e=ye),void 0===t&&(t=16),void 0===r&&(r=9e9);for(var u,f,c=[],a=i;o>=a;a++)e(a,n)?void 0!==u&&void 0!==f&&(c.push(u,f),u=f=void 0):(f=a,void 0===u&&(u=a));if(void 0!==u&&void 0!==f){var s=Math.min(Math.max(f,u+t-1),r-1);for(a=f+1;s>=a&&!e(a,n);a++)f=a;c.push(u,f)}if(c.length)for(var l=c[0],v=c[1];t>v-l+1&&l>0;){var d=l-1;if(e(d,n))break;c[0]=l=d}return c}(l.current,o,n,a,Math.max(0,e-f),Math.min(a-1,(t||0)+f)),i=0;i<r.length-1;++i)s.current(r[i],r[++i],n)}),[a,o,f,s,l])},e.useMasonry=d,e.usePositioner=x,e.useResizeObserver=y,e.useScrollToIndex=w,e.useScroller=m,Object.defineProperty(e,"__esModule",{value:1})}));
 //# sourceMappingURL=masonic.js.map

package.json

 {
   "name": "masonic",
-  "version": "3.7.0",
+  "version": "4.0.0",
   "description": "",
@@ -10,2 +10,14 @@ "license": "MIT",
   "bugs": "https://github.com/jaredLunde/masonic/issues",
+  "exports": {
+    ".": {
+      "browser": "./dist/module/index.js",
+      "import": "./dist/esm/index.mjs",
+      "require": "./dist/main/index.js",
+      "umd": "./dist/umd/masonic.js",
+      "source": "./src/index.tsx",
+      "types": "./types/index.d.ts",
+      "default": "./dist/main/index.js"
+    },
+    "./package.json": "./package.json"
+  },
   "main": "dist/main/index.js",
@@ -39,4 +51,3 @@ "module": "dist/module/index.js",
     "@essentials/request-timeout": "^1.3.0",
-    "@juggle/resize-observer": "^3.3.1",
-    "@react-hook/event": "^1.2.3",
+    "@react-hook/event": "^1.2.6",
     "@react-hook/latest": "^1.0.3",
@@ -46,4 +57,3 @@ "@react-hook/passive-layout-effect": "^1.2.1",
     "@react-hook/window-scroll": "^1.3.0",
-    "@react-hook/window-size": "^3.0.7",
-    "@types/raf-schd": "^4.0.1",
+    "@react-hook/window-size": "^3.1.1",
     "raf-schd": "^4.0.3",
@@ -56,2 +66,3 @@ "trie-memoize": "^1.2.0"
   "devDependencies": {
+    "@babel/types": "^7.24.0",
     "@commitlint/cli": "latest",
@@ -63,4 +74,5 @@ "@commitlint/config-conventional": "latest",
     "@shopify/jest-dom-mocks": "^3.0.7",
-    "@swc-node/core": "^1.6.0",
-    "@swc-node/jest": "^1.3.2",
+    "@swc-node/core": "^1.7.0",
+    "@swc-node/jest": "^1.3.3",
+    "@swc/core": "^1.5.0",
     "@testing-library/jest-dom": "latest",
@@ -70,3 +82,5 @@ "@testing-library/react": "latest",
     "@testing-library/user-event": "latest",
-    "@types/jest": "latest",
+    "@types/jest": "^27.4.0",
+    "@types/node": "^20.12.7",
+    "@types/raf-schd": "^4.0.3",
     "@types/react": "latest",
@@ -79,6 +93,6 @@ "@types/react-dom": "latest",
     "husky": "latest",
-    "jest": "latest",
+    "jest": "^27.4.7",
     "lint-staged": "latest",
-    "lundle": "latest",
-    "node-fetch": "^2.6.0",
+    "lundle": "^0.4.13",
+    "node-fetch": "^2.6.5",
     "prettier": "latest",
@@ -89,3 +103,3 @@ "rand-int": "^1.0.0",
     "react-test-renderer": "latest",
-    "typescript": "latest"
+    "typescript": "^4.5.4"
   },
@@ -134,15 +148,2 @@ "keywords": [
   ],
-  "exports": {
-    ".": {
-      "browser": "./dist/module/index.js",
-      "import": "./dist/esm/index.mjs",
-      "require": "./dist/main/index.js",
-      "umd": "./dist/umd/masonic.js",
-      "source": "./src/index.tsx",
-      "types": "./types/index.d.ts",
-      "default": "./dist/main/index.js"
-    },
-    "./package.json": "./package.json",
-    "./": "./"
-  },
   "jest": {
@@ -187,3 +188,3 @@ "collectCoverageFrom": [
     "package.json": [
-      "pnpx -y prettier-package-json --write"
+      "pnpx prettier-package-json --write"
     ],
@@ -190,0 +191,0 @@ "**/*.{ts,tsx,js,jsx}": [

src/interval-tree.ts

@@ -117,6 +117,4 @@ type Color = 0 | 1 | 2;
   if (x.P === NULL_NODE) tree.root = y;
-  else {
-    if (x === x.P.L) x.P.L = y;
-    else x.P.R = y;
-  }
+  else if (x === x.P.L) x.P.L = y;
+  else x.P.R = y;
 
@@ -138,6 +136,4 @@ y.L = x;
   if (x.P === NULL_NODE) tree.root = y;
-  else {
-    if (x === x.P.R) x.P.R = y;
-    else x.P.L = y;
-  }
+  else if (x === x.P.R) x.P.R = y;
+  else x.P.L = y;
 
@@ -144,0 +140,0 @@ y.R = x;

src/use-resize-observer.test.ts

@@ -1,2 +0,1 @@
-import "@juggle/resize-observer";
 import { elementsCache } from "./elements-cache";
@@ -20,2 +19,3 @@ import { createPositioner } from "./use-positioner";
 afterEach(() => {
+  // @ts-expect-error
   window.requestAnimationFrame.mockRestore();
@@ -25,32 +25,27 @@ jest.clearAllTimers();
 
-jest.mock("@juggle/resize-observer", () => {
-  class ResizeObserver {
-    els = [];
-    callback: any;
-    constructor(callback) {
-      this.callback = callback;
-    }
-    observe(el) {
-      this.els.push(el);
-    }
-    unobserve() {
-      // do nothing
-    }
-    disconnect() {}
+class ResizeObserver {
+  els = [];
+  callback: any;
+  constructor(callback) {
+    this.callback = callback;
+  }
+  observe(el) {
+    this.els.push(el);
+  }
+  unobserve() {
+    // do nothing
+  }
+  disconnect() {}
 
-    resize(index: number, height: number) {
-      this.els[index].offsetHeight = height;
-      this.callback(
-        this.els.map((el) => ({
-          target: el,
-        }))
-      );
-    }
+  resize(index: number, height: number) {
+    // @ts-expect-error
+    this.els[index].offsetHeight = height;
+    this.callback(
+      this.els.map((el) => ({
+        target: el,
+      }))
+    );
   }
-  window.ResizeObserver = ResizeObserver;
-  return {
-    __esModule: true,
-    default: ResizeObserver,
-  };
-});
+}
+window.ResizeObserver = ResizeObserver;
 
@@ -57,0 +52,0 @@ describe("createResizeObserver", () => {

src/use-resize-observer.ts

@@ -1,2 +0,1 @@
-import { ResizeObserver as Polyfill } from "@juggle/resize-observer";
 import rafSchd from "raf-schd";
@@ -9,7 +8,2 @@ import * as React from "react";
 
-const ResizeObserver =
-  typeof window !== "undefined" && "ResizeObserver" in window
-    ? window.ResizeObserver
-    : Polyfill;
-
 /**
@@ -16,0 +10,0 @@ * Creates a resize observer that forces updates to the grid cell positions when mutations are

types/interval-tree.d.ts

 export interface IIntervalTree {
-    insert(low: number, high: number, index: number): void;
-    remove(index: number): void;
-    search(low: number, high: number, callback: (index: number, low: number) => any): void;
-    size: number;
+  insert(low: number, high: number, index: number): void;
+  remove(index: number): void;
+  search(
+    low: number,
+    high: number,
+    callback: (index: number, low: number) => any
+  ): void;
+  size: number;
 }
 export declare function createIntervalTree(): IIntervalTree;

types/list.d.ts

@@ -10,11 +10,15 @@ /// <reference types="react" />
 export declare namespace List {
-    var displayName: string;
+  var displayName: string;
 }
-export interface ListProps<Item> extends Omit<MasonryProps<Item>, "columGutter" | "columnCount" | "columnWidth"> {
-    /**
-     * The amount of vertical space in pixels to add between the list cells.
-     *
-     * @default 0
-     */
-    rowGutter?: number;
+export interface ListProps<Item>
+  extends Omit<
+    MasonryProps<Item>,
+    "columGutter" | "columnCount" | "columnWidth"
+  > {
+  /**
+   * The amount of vertical space in pixels to add between the list cells.
+   *
+   * @default 0
+   */
+  rowGutter?: number;
 }

types/masonry-scroller.d.ts

@@ -9,23 +9,26 @@ /// <reference types="react" />
  */
-export declare function MasonryScroller<Item>(props: MasonryScrollerProps<Item>): JSX.Element;
+export declare function MasonryScroller<Item>(
+  props: MasonryScrollerProps<Item>
+): JSX.Element;
 export declare namespace MasonryScroller {
-    var displayName: string;
+  var displayName: string;
 }
-export interface MasonryScrollerProps<Item> extends Omit<UseMasonryOptions<Item>, "scrollTop" | "isScrolling"> {
-    /**
-     * This determines how often (in frames per second) to update the scroll position of the
-     * browser `window` in state, and as a result the rate the masonry grid recalculates its visible cells.
-     * The default value of `12` has been very reasonable in my own testing, but if you have particularly
-     * heavy `render` components it may be prudent to reduce this number.
-     *
-     * @default 12
-     */
-    scrollFps?: number;
-    /**
-     * The vertical space in pixels between the top of the grid container and the top
-     * of the browser `document.documentElement`.
-     *
-     * @default 0
-     */
-    offset?: number;
+export interface MasonryScrollerProps<Item>
+  extends Omit<UseMasonryOptions<Item>, "scrollTop" | "isScrolling"> {
+  /**
+   * This determines how often (in frames per second) to update the scroll position of the
+   * browser `window` in state, and as a result the rate the masonry grid recalculates its visible cells.
+   * The default value of `12` has been very reasonable in my own testing, but if you have particularly
+   * heavy `render` components it may be prudent to reduce this number.
+   *
+   * @default 12
+   */
+  scrollFps?: number;
+  /**
+   * The vertical space in pixels between the top of the grid container and the top
+   * of the browser `document.documentElement`.
+   *
+   * @default 0
+   */
+  offset?: number;
 }

types/use-container-position.d.ts

@@ -13,13 +13,16 @@ import * as React from "react";
  */
-export declare function useContainerPosition(elementRef: React.MutableRefObject<HTMLElement | null>, deps?: React.DependencyList): ContainerPosition;
+export declare function useContainerPosition(
+  elementRef: React.MutableRefObject<HTMLElement | null>,
+  deps?: React.DependencyList
+): ContainerPosition;
 export interface ContainerPosition {
-    /**
-     * The distance in pixels between the top of the element in `elementRef` and the top of
-     * the `document.documentElement`.
-     */
-    offset: number;
-    /**
-     * The `offsetWidth` of the element in `elementRef`.
-     */
-    width: number;
+  /**
+   * The distance in pixels between the top of the element in `elementRef` and the top of
+   * the `document.documentElement`.
+   */
+  offset: number;
+  /**
+   * The `offsetWidth` of the element in `elementRef`.
+   */
+  width: number;
 }

types/use-infinite-loader.d.ts

@@ -13,33 +13,43 @@ /**
  */
-export declare function useInfiniteLoader<Item, T extends LoadMoreItemsCallback<Item>>(loadMoreItems: T, options?: UseInfiniteLoaderOptions<Item>): LoadMoreItemsCallback<Item>;
+export declare function useInfiniteLoader<
+  Item,
+  T extends LoadMoreItemsCallback<Item>
+>(
+  loadMoreItems: T,
+  options?: UseInfiniteLoaderOptions<Item>
+): LoadMoreItemsCallback<Item>;
 export interface UseInfiniteLoaderOptions<Item> {
-    /**
-     *  A callback responsible for determining the loaded state of each item. Should return `true`
-     * if the item has already been loaded and `false` if not.
-     *
-     * @default (index: number, items: any[]) => boolean
-     */
-    isItemLoaded?: (index: number, items: Item[]) => boolean;
-    /**
-     * The minimum number of new items to be loaded at a time.  This property can be used to
-     * batch requests and reduce HTTP requests.
-     *
-     * @default 16
-     */
-    minimumBatchSize?: number;
-    /**
-     * The threshold at which to pre-fetch data. A threshold X means that new data should start
-     * loading when a user scrolls within X cells of the end of your `items` array.
-     *
-     * @default 16
-     */
-    threshold?: number;
-    /**
-     * The total number of items you'll need to eventually load (if known). This can
-     * be arbitrarily high if not known.
-     *
-     * @default 9e9
-     */
-    totalItems?: number;
+  /**
+   *  A callback responsible for determining the loaded state of each item. Should return `true`
+   * if the item has already been loaded and `false` if not.
+   *
+   * @default (index: number, items: any[]) => boolean
+   */
+  isItemLoaded?: (index: number, items: Item[]) => boolean;
+  /**
+   * The minimum number of new items to be loaded at a time.  This property can be used to
+   * batch requests and reduce HTTP requests.
+   *
+   * @default 16
+   */
+  minimumBatchSize?: number;
+  /**
+   * The threshold at which to pre-fetch data. A threshold X means that new data should start
+   * loading when a user scrolls within X cells of the end of your `items` array.
+   *
+   * @default 16
+   */
+  threshold?: number;
+  /**
+   * The total number of items you'll need to eventually load (if known). This can
+   * be arbitrarily high if not known.
+   *
+   * @default 9e9
+   */
+  totalItems?: number;
 }
-export declare type LoadMoreItemsCallback<Item> = (startIndex: number, stopIndex: number, items: Item[]) => any;
+export declare type LoadMoreItemsCallback<Item> = (
+  startIndex: number,
+  stopIndex: number,
+  items: Item[]
+) => any;

types/use-masonry.d.ts

@@ -28,87 +28,110 @@ import * as React from "react";
  */
-export declare function useMasonry<Item>({ positioner, resizeObserver, items, as: ContainerComponent, id, className, style, role, tabIndex, containerRef, itemAs: ItemComponent, itemStyle, itemHeightEstimate, itemKey, overscanBy, scrollTop, isScrolling, height, render: RenderComponent, onRender, }: UseMasonryOptions<Item>): JSX.Element;
+export declare function useMasonry<Item>({
+  positioner,
+  resizeObserver,
+  items,
+  as: ContainerComponent,
+  id,
+  className,
+  style,
+  role,
+  tabIndex,
+  containerRef,
+  itemAs: ItemComponent,
+  itemStyle,
+  itemHeightEstimate,
+  itemKey,
+  overscanBy,
+  scrollTop,
+  isScrolling,
+  height,
+  render: RenderComponent,
+  onRender,
+}: UseMasonryOptions<Item>): JSX.Element;
 export interface UseMasonryOptions<Item> {
-    /**
-     * An array containing the data used by the grid items.
-     */
-    items: Item[];
-    /**
-     * A grid cell positioner and cache created by the `usePositioner()` hook or
-     * the `createPositioner` utility.
-     */
-    positioner: Positioner;
-    /**
-     * A resize observer that tracks mutations to the grid cells and forces the
-     * Masonry grid to recalculate its layout if any cells affect column heights
-     * change. Check out the `useResizeObserver()` hook.
-     */
-    resizeObserver?: {
-        observe: ResizeObserver["observe"];
-        disconnect: ResizeObserver["observe"];
-        unobserve: ResizeObserver["unobserve"];
-    };
-    /**
-     * This is the type of element the grid container will be rendered as.
-     *
-     * @default "div"`
-     */
-    as?: keyof JSX.IntrinsicElements | React.ComponentType<any>;
-    /**
-     * Optionally gives the grid container an `id` prop.
-     */
-    id?: string;
-    /**
-     * Optionally gives the grid container a `className` prop.
-     */
-    className?: string;
-    /**
-     * Adds extra `style` attributes to the container in addition to those
-     * created by the `useMasonry()` hook.
-     */
-    style?: React.CSSProperties;
-    /**
-     * Optionally swap out the accessibility `role` prop of the container and its items.
-     *
-     * @default "grid"
-     */
-    role?: "grid" | "list";
-    /**
-     * Change the `tabIndex` of the grid container.
-     *
-     * @default 0
-     */
-    tabIndex?: number;
-    /**
-     * Forwards a React ref to the grid container.
-     */
-    containerRef?: ((element: HTMLElement) => void) | React.MutableRefObject<HTMLElement | null>;
-    /**
-     * This is the type of element the grid items will be rendered as.
-     *
-     * @default "div"
-     */
-    itemAs?: keyof JSX.IntrinsicElements | React.ComponentType<any>;
-    /**
-     * Adds extra `style` attributes to the grid items in addition to those
-     * created by the `useMasonry()` hook.
-     */
-    itemStyle?: React.CSSProperties;
-    /**
-     * This value is used for estimating the initial height of the masonry grid. It is important for
-     * the UX of the scrolling behavior and in determining how many `items` to render in a batch, so it's
-     * wise to set this value with some level accuracy, though it doesn't need to be perfect.
-     *
-     * @default 300
-     */
-    itemHeightEstimate?: number;
-    /**
-     * The value returned here must be unique to the item. By default, the key is the item's index. This is ok
-     * if your collection of items is never modified. Setting this property ensures that the component in `render`
-     * is reused each time the masonry grid is reflowed. A common pattern would be to return the item's database
-     * ID here if there is one, e.g. `data => data.id`
-     *
-     * @default (data, index) => index`
-     */
-    itemKey?: (data: Item, index: number) => string | number;
-    /**
+  /**
+   * An array containing the data used by the grid items.
+   */
+  items: Item[];
+  /**
+   * A grid cell positioner and cache created by the `usePositioner()` hook or
+   * the `createPositioner` utility.
+   */
+  positioner: Positioner;
+  /**
+   * A resize observer that tracks mutations to the grid cells and forces the
+   * Masonry grid to recalculate its layout if any cells affect column heights
+   * change. Check out the `useResizeObserver()` hook.
+   */
+  resizeObserver?: {
+    observe: ResizeObserver["observe"];
+    disconnect: ResizeObserver["observe"];
+    unobserve: ResizeObserver["unobserve"];
+  };
+  /**
+   * This is the type of element the grid container will be rendered as.
+   *
+   * @default "div"`
+   */
+  as?: keyof JSX.IntrinsicElements | React.ComponentType<any>;
+  /**
+   * Optionally gives the grid container an `id` prop.
+   */
+  id?: string;
+  /**
+   * Optionally gives the grid container a `className` prop.
+   */
+  className?: string;
+  /**
+   * Adds extra `style` attributes to the container in addition to those
+   * created by the `useMasonry()` hook.
+   */
+  style?: React.CSSProperties;
+  /**
+   * Optionally swap out the accessibility `role` prop of the container and its items.
+   *
+   * @default "grid"
+   */
+  role?: "grid" | "list";
+  /**
+   * Change the `tabIndex` of the grid container.
+   *
+   * @default 0
+   */
+  tabIndex?: number;
+  /**
+   * Forwards a React ref to the grid container.
+   */
+  containerRef?:
+    | ((element: HTMLElement) => void)
+    | React.MutableRefObject<HTMLElement | null>;
+  /**
+   * This is the type of element the grid items will be rendered as.
+   *
+   * @default "div"
+   */
+  itemAs?: keyof JSX.IntrinsicElements | React.ComponentType<any>;
+  /**
+   * Adds extra `style` attributes to the grid items in addition to those
+   * created by the `useMasonry()` hook.
+   */
+  itemStyle?: React.CSSProperties;
+  /**
+   * This value is used for estimating the initial height of the masonry grid. It is important for
+   * the UX of the scrolling behavior and in determining how many `items` to render in a batch, so it's
+   * wise to set this value with some level accuracy, though it doesn't need to be perfect.
+   *
+   * @default 300
+   */
+  itemHeightEstimate?: number;
+  /**
+   * The value returned here must be unique to the item. By default, the key is the item's index. This is ok
+   * if your collection of items is never modified. Setting this property ensures that the component in `render`
+   * is reused each time the masonry grid is reflowed. A common pattern would be to return the item's database
+   * ID here if there is one, e.g. `data => data.id`
+   *
+   * @default (data, index) => index`
+   */
+  itemKey?: (data: Item, index: number) => string | number;
+  /**
      * This number is used for determining the number of grid cells outside of the visible window to render.
@@ -126,51 +149,51 @@ * The default value is `2` which means "render 2 windows worth (2 * `height`) of content before and after
      */
-    overscanBy?: number;
-    /**
-     * This is the height of the window. If you're rendering the grid relative to the browser `window`,
-     * the current `document.documentElement.clientHeight` is the value you'll want to set here. If you're
-     * rendering the grid inside of another HTML element, you'll want to provide the current `element.offsetHeight`
-     * here.
-     */
-    height: number;
-    /**
-     * The current scroll progress in pixel of the window the grid is rendered in. If you're rendering
-     * the grid relative to the browser `window`, you'll want the most current `window.scrollY` here.
-     * If you're rendering the grid inside of another HTML element, you'll want the current `element.scrollTop`
-     * value here. The `useScroller()` hook and `<MasonryScroller>` components will help you if you're
-     * rendering the grid relative to the browser `window`.
-     */
-    scrollTop: number;
-    /**
-     * This property is used for determining whether or not the grid container should add styles that
-     * dramatically increase scroll performance. That is, turning off `pointer-events` and adding a
-     * `will-change: contents;` value to the style string. You can forgo using this prop, but I would
-     * not recommend that. The `useScroller()` hook and `<MasonryScroller>` components will help you if
-     * you're rendering the grid relative to the browser `window`.
-     *
-     * @default false
-     */
-    isScrolling?: boolean;
-    /**
-     * This component is rendered for each item of your `items` prop array. It should accept three props:
-     * `index`, `width`, and `data`. See RenderComponentProps.
-     */
-    render: React.ComponentType<RenderComponentProps<Item>>;
-    /**
-     * This callback is invoked any time the items currently being rendered by the grid change.
-     */
-    onRender?: (startIndex: number, stopIndex: number, items: Item[]) => void;
+  overscanBy?: number;
+  /**
+   * This is the height of the window. If you're rendering the grid relative to the browser `window`,
+   * the current `document.documentElement.clientHeight` is the value you'll want to set here. If you're
+   * rendering the grid inside of another HTML element, you'll want to provide the current `element.offsetHeight`
+   * here.
+   */
+  height: number;
+  /**
+   * The current scroll progress in pixel of the window the grid is rendered in. If you're rendering
+   * the grid relative to the browser `window`, you'll want the most current `window.scrollY` here.
+   * If you're rendering the grid inside of another HTML element, you'll want the current `element.scrollTop`
+   * value here. The `useScroller()` hook and `<MasonryScroller>` components will help you if you're
+   * rendering the grid relative to the browser `window`.
+   */
+  scrollTop: number;
+  /**
+   * This property is used for determining whether or not the grid container should add styles that
+   * dramatically increase scroll performance. That is, turning off `pointer-events` and adding a
+   * `will-change: contents;` value to the style string. You can forgo using this prop, but I would
+   * not recommend that. The `useScroller()` hook and `<MasonryScroller>` components will help you if
+   * you're rendering the grid relative to the browser `window`.
+   *
+   * @default false
+   */
+  isScrolling?: boolean;
+  /**
+   * This component is rendered for each item of your `items` prop array. It should accept three props:
+   * `index`, `width`, and `data`. See RenderComponentProps.
+   */
+  render: React.ComponentType<RenderComponentProps<Item>>;
+  /**
+   * This callback is invoked any time the items currently being rendered by the grid change.
+   */
+  onRender?: (startIndex: number, stopIndex: number, items: Item[]) => void;
 }
 export interface RenderComponentProps<Item> {
-    /**
-     * The index of the cell in the `items` prop array.
-     */
-    index: number;
-    /**
-     * The rendered width of the cell's column.
-     */
-    width: number;
-    /**
-     * The data at `items[index]` of your `items` prop array.
-     */
-    data: Item;
+  /**
+   * The index of the cell in the `items` prop array.
+   */
+  index: number;
+  /**
+   * The rendered width of the cell's column.
+   */
+  width: number;
+  /**
+   * The data at `items[index]` of your `items` prop array.
+   */
+  data: Item;
 }

types/use-resize-observer.d.ts

@@ -8,3 +8,5 @@ import type { Positioner } from "./use-positioner";
  */
-export declare function useResizeObserver(positioner: Positioner): ResizeObserver;
+export declare function useResizeObserver(
+  positioner: Positioner
+): ResizeObserver;
 /**
@@ -17,2 +19,5 @@ * Creates a resize observer that fires an `updater` callback whenever the height of
  */
-export declare const createResizeObserver: (positioner: Positioner, updater: (updates: number[]) => void) => ResizeObserver;
+export declare const createResizeObserver: (
+  positioner: Positioner,
+  updater: (updates: number[]) => void
+) => ResizeObserver;

types/use-scroll-to-index.d.ts

@@ -10,30 +10,33 @@ import * as React from "react";
  */
-export declare function useScrollToIndex(positioner: Positioner, options: UseScrollToIndexOptions): (index: number) => void;
+export declare function useScrollToIndex(
+  positioner: Positioner,
+  options: UseScrollToIndexOptions
+): (index: number) => void;
 export declare type UseScrollToIndexOptions = {
-    /**
-     * The window element or a React ref for the window element. That is,
-     * this is the grid container.
-     *
-     * @default window
-     */
-    element?: Window | HTMLElement | React.RefObject<HTMLElement> | null;
-    /**
-     * Sets the vertical alignment of the cell within the grid container.
-     *
-     * @default "top"
-     */
-    align?: "center" | "top" | "bottom";
-    /**
-     * The height of the grid.
-     *
-     * @default window.innerHeight
-     */
-    height?: number;
-    /**
-     * The vertical space in pixels between the top of the grid container and the top
-     * of the window.
-     *
-     * @default 0
-     */
-    offset?: number;
+  /**
+   * The window element or a React ref for the window element. That is,
+   * this is the grid container.
+   *
+   * @default window
+   */
+  element?: Window | HTMLElement | React.RefObject<HTMLElement> | null;
+  /**
+   * Sets the vertical alignment of the cell within the grid container.
+   *
+   * @default "top"
+   */
+  align?: "center" | "top" | "bottom";
+  /**
+   * The height of the grid.
+   *
+   * @default window.innerHeight
+   */
+  height?: number;
+  /**
+   * The vertical space in pixels between the top of the grid container and the top
+   * of the window.
+   *
+   * @default 0
+   */
+  offset?: number;
 };

types/use-scroller.d.ts

@@ -13,5 +13,8 @@ /**
  */
-export declare function useScroller(offset?: number, fps?: number): {
-    scrollTop: number;
-    isScrolling: boolean;
+export declare function useScroller(
+  offset?: number,
+  fps?: number
+): {
+  scrollTop: number;
+  isScrolling: boolean;
 };

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

Dependency count

12

decreased by-14.29%

Worsened metrics

Total package byte prevSize

857177

decreased by-11.64%

Dev dependency count

34

increased by13.33%

Lines of code

9093

decreased by-5.57%

Number of lines in readme file

846

decreased by-0.12%

Dependency changes

• - Removed@juggle/resize-observer@^3.3.1

• - Removed@types/raf-schd@^4.0.1

• - Removed@juggle/resize-observer@3.4.0(transitive)

• - Removed@types/raf-schd@4.0.3(transitive)

• Updated@react-hook/event@^1.2.6

• Updated@react-hook/window-size@^3.1.1