@tanstack/react-virtual - npm Package Compare versions

Comparing version 3.13.14 to 3.13.15

dist/cjs/index.cjs

@@ -24,3 +24,6 @@ "use strict";
 const useIsomorphicLayoutEffect = typeof document !== "undefined" ? React__namespace.useLayoutEffect : React__namespace.useEffect;
-function useVirtualizerBase(options) {
+function useVirtualizerBase({
+  useFlushSync = true,
+  ...options
+}) {
   const rerender = React__namespace.useReducer(() => ({}), {})[1];
@@ -31,3 +34,3 @@ const resolvedOptions = {
       var _a;
-      if (sync) {
+      if (useFlushSync && sync) {
         reactDom.flushSync(rerender);
@@ -34,0 +37,0 @@ } else {

dist/cjs/index.cjs.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"index.cjs","sources":["../../src/index.tsx"],"sourcesContent":["import * as React from 'react'\nimport { flushSync } from 'react-dom'\nimport {\n  Virtualizer,\n  elementScroll,\n  observeElementOffset,\n  observeElementRect,\n  observeWindowOffset,\n  observeWindowRect,\n  windowScroll,\n} from '@tanstack/virtual-core'\nimport type { PartialKeys, VirtualizerOptions } from '@tanstack/virtual-core'\n\nexport * from '@tanstack/virtual-core'\n\nconst useIsomorphicLayoutEffect =\n  typeof document !== 'undefined' ? React.useLayoutEffect : React.useEffect\n\nfunction useVirtualizerBase<\n  TScrollElement extends Element | Window,\n  TItemElement extends Element,\n>(\n  options: VirtualizerOptions<TScrollElement, TItemElement>,\n): Virtualizer<TScrollElement, TItemElement> {\n  const rerender = React.useReducer(() => ({}), {})[1]\n\n  const resolvedOptions: VirtualizerOptions<TScrollElement, TItemElement> = {\n    ...options,\n    onChange: (instance, sync) => {\n      if (sync) {\n        flushSync(rerender)\n      } else {\n        rerender()\n      }\n      options.onChange?.(instance, sync)\n    },\n  }\n\n  const [instance] = React.useState(\n    () => new Virtualizer<TScrollElement, TItemElement>(resolvedOptions),\n  )\n\n  instance.setOptions(resolvedOptions)\n\n  useIsomorphicLayoutEffect(() => {\n    return instance._didMount()\n  }, [])\n\n  useIsomorphicLayoutEffect(() => {\n    return instance._willUpdate()\n  })\n\n  return instance\n}\n\nexport function useVirtualizer<\n  TScrollElement extends Element,\n  TItemElement extends Element,\n>(\n  options: PartialKeys<\n    VirtualizerOptions<TScrollElement, TItemElement>,\n    'observeElementRect' | 'observeElementOffset' | 'scrollToFn'\n  >,\n): Virtualizer<TScrollElement, TItemElement> {\n  return useVirtualizerBase<TScrollElement, TItemElement>({\n    observeElementRect: observeElementRect,\n    observeElementOffset: observeElementOffset,\n    scrollToFn: elementScroll,\n    ...options,\n  })\n}\n\nexport function useWindowVirtualizer<TItemElement extends Element>(\n  options: PartialKeys<\n    VirtualizerOptions<Window, TItemElement>,\n    | 'getScrollElement'\n    | 'observeElementRect'\n    | 'observeElementOffset'\n    | 'scrollToFn'\n  >,\n): Virtualizer<Window, TItemElement> {\n  return useVirtualizerBase<Window, TItemElement>({\n    getScrollElement: () => (typeof document !== 'undefined' ? window : null),\n    observeElementRect: observeWindowRect,\n    observeElementOffset: observeWindowOffset,\n    scrollToFn: windowScroll,\n    initialOffset: () => (typeof document !== 'undefined' ? window.scrollY : 0),\n    ...options,\n  })\n}\n"],"names":["React","instance","flushSync","Virtualizer","observeElementRect","observeElementOffset","elementScroll","observeWindowRect","observeWindowOffset","windowScroll"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAeA,MAAM,4BACJ,OAAO,aAAa,cAAcA,iBAAM,kBAAkBA,iBAAM;AAElE,SAAS,mBAIP,SAC2C;AAC3C,QAAM,WAAWA,iBAAM,WAAW,OAAO,CAAA,IAAK,CAAA,CAAE,EAAE,CAAC;AAEnD,QAAM,kBAAoE;AAAA,IACxE,GAAG;AAAA,IACH,UAAU,CAACC,WAAU,SAAS;;AAC5B,UAAI,MAAM;AACRC,iBAAAA,UAAU,QAAQ;AAAA,MACpB,OAAO;AACL,iBAAA;AAAA,MACF;AACA,oBAAQ,aAAR,iCAAmBD,WAAU;AAAA,IAC/B;AAAA,EAAA;AAGF,QAAM,CAAC,QAAQ,IAAID,iBAAM;AAAA,IACvB,MAAM,IAAIG,YAAAA,YAA0C,eAAe;AAAA,EAAA;AAGrE,WAAS,WAAW,eAAe;AAEnC,4BAA0B,MAAM;AAC9B,WAAO,SAAS,UAAA;AAAA,EAClB,GAAG,CAAA,CAAE;AAEL,4BAA0B,MAAM;AAC9B,WAAO,SAAS,YAAA;AAAA,EAClB,CAAC;AAED,SAAO;AACT;AAEO,SAAS,eAId,SAI2C;AAC3C,SAAO,mBAAiD;AAAA,IAAA,oBACtDC,YAAAA;AAAAA,IAAA,sBACAC,YAAAA;AAAAA,IACA,YAAYC,YAAAA;AAAAA,IACZ,GAAG;AAAA,EAAA,CACJ;AACH;AAEO,SAAS,qBACd,SAOmC;AACnC,SAAO,mBAAyC;AAAA,IAC9C,kBAAkB,MAAO,OAAO,aAAa,cAAc,SAAS;AAAA,IACpE,oBAAoBC,YAAAA;AAAAA,IACpB,sBAAsBC,YAAAA;AAAAA,IACtB,YAAYC,YAAAA;AAAAA,IACZ,eAAe,MAAO,OAAO,aAAa,cAAc,OAAO,UAAU;AAAA,IACzE,GAAG;AAAA,EAAA,CACJ;AACH;;;;;;;;;"}
+{"version":3,"file":"index.cjs","sources":["../../src/index.tsx"],"sourcesContent":["import * as React from 'react'\nimport { flushSync } from 'react-dom'\nimport {\n  Virtualizer,\n  elementScroll,\n  observeElementOffset,\n  observeElementRect,\n  observeWindowOffset,\n  observeWindowRect,\n  windowScroll,\n} from '@tanstack/virtual-core'\nimport type { PartialKeys, VirtualizerOptions } from '@tanstack/virtual-core'\n\nexport * from '@tanstack/virtual-core'\n\nconst useIsomorphicLayoutEffect =\n  typeof document !== 'undefined' ? React.useLayoutEffect : React.useEffect\n\nexport type ReactVirtualizerOptions<\n  TScrollElement extends Element | Window,\n  TItemElement extends Element,\n> = VirtualizerOptions<TScrollElement, TItemElement> & {\n  useFlushSync?: boolean\n}\n\nfunction useVirtualizerBase<\n  TScrollElement extends Element | Window,\n  TItemElement extends Element,\n>({\n  useFlushSync = true,\n  ...options\n}: ReactVirtualizerOptions<TScrollElement, TItemElement>): Virtualizer<\n  TScrollElement,\n  TItemElement\n> {\n  const rerender = React.useReducer(() => ({}), {})[1]\n\n  const resolvedOptions: VirtualizerOptions<TScrollElement, TItemElement> = {\n    ...options,\n    onChange: (instance, sync) => {\n      if (useFlushSync && sync) {\n        flushSync(rerender)\n      } else {\n        rerender()\n      }\n      options.onChange?.(instance, sync)\n    },\n  }\n\n  const [instance] = React.useState(\n    () => new Virtualizer<TScrollElement, TItemElement>(resolvedOptions),\n  )\n\n  instance.setOptions(resolvedOptions)\n\n  useIsomorphicLayoutEffect(() => {\n    return instance._didMount()\n  }, [])\n\n  useIsomorphicLayoutEffect(() => {\n    return instance._willUpdate()\n  })\n\n  return instance\n}\n\nexport function useVirtualizer<\n  TScrollElement extends Element,\n  TItemElement extends Element,\n>(\n  options: PartialKeys<\n    ReactVirtualizerOptions<TScrollElement, TItemElement>,\n    'observeElementRect' | 'observeElementOffset' | 'scrollToFn'\n  >,\n): Virtualizer<TScrollElement, TItemElement> {\n  return useVirtualizerBase<TScrollElement, TItemElement>({\n    observeElementRect: observeElementRect,\n    observeElementOffset: observeElementOffset,\n    scrollToFn: elementScroll,\n    ...options,\n  })\n}\n\nexport function useWindowVirtualizer<TItemElement extends Element>(\n  options: PartialKeys<\n    ReactVirtualizerOptions<Window, TItemElement>,\n    | 'getScrollElement'\n    | 'observeElementRect'\n    | 'observeElementOffset'\n    | 'scrollToFn'\n  >,\n): Virtualizer<Window, TItemElement> {\n  return useVirtualizerBase<Window, TItemElement>({\n    getScrollElement: () => (typeof document !== 'undefined' ? window : null),\n    observeElementRect: observeWindowRect,\n    observeElementOffset: observeWindowOffset,\n    scrollToFn: windowScroll,\n    initialOffset: () => (typeof document !== 'undefined' ? window.scrollY : 0),\n    ...options,\n  })\n}\n"],"names":["React","instance","flushSync","Virtualizer","observeElementRect","observeElementOffset","elementScroll","observeWindowRect","observeWindowOffset","windowScroll"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAeA,MAAM,4BACJ,OAAO,aAAa,cAAcA,iBAAM,kBAAkBA,iBAAM;AASlE,SAAS,mBAGP;AAAA,EACA,eAAe;AAAA,EACf,GAAG;AACL,GAGE;AACA,QAAM,WAAWA,iBAAM,WAAW,OAAO,CAAA,IAAK,CAAA,CAAE,EAAE,CAAC;AAEnD,QAAM,kBAAoE;AAAA,IACxE,GAAG;AAAA,IACH,UAAU,CAACC,WAAU,SAAS;;AAC5B,UAAI,gBAAgB,MAAM;AACxBC,iBAAAA,UAAU,QAAQ;AAAA,MACpB,OAAO;AACL,iBAAA;AAAA,MACF;AACA,oBAAQ,aAAR,iCAAmBD,WAAU;AAAA,IAC/B;AAAA,EAAA;AAGF,QAAM,CAAC,QAAQ,IAAID,iBAAM;AAAA,IACvB,MAAM,IAAIG,YAAAA,YAA0C,eAAe;AAAA,EAAA;AAGrE,WAAS,WAAW,eAAe;AAEnC,4BAA0B,MAAM;AAC9B,WAAO,SAAS,UAAA;AAAA,EAClB,GAAG,CAAA,CAAE;AAEL,4BAA0B,MAAM;AAC9B,WAAO,SAAS,YAAA;AAAA,EAClB,CAAC;AAED,SAAO;AACT;AAEO,SAAS,eAId,SAI2C;AAC3C,SAAO,mBAAiD;AAAA,IAAA,oBACtDC,YAAAA;AAAAA,IAAA,sBACAC,YAAAA;AAAAA,IACA,YAAYC,YAAAA;AAAAA,IACZ,GAAG;AAAA,EAAA,CACJ;AACH;AAEO,SAAS,qBACd,SAOmC;AACnC,SAAO,mBAAyC;AAAA,IAC9C,kBAAkB,MAAO,OAAO,aAAa,cAAc,SAAS;AAAA,IACpE,oBAAoBC,YAAAA;AAAAA,IACpB,sBAAsBC,YAAAA;AAAAA,IACtB,YAAYC,YAAAA;AAAAA,IACZ,eAAe,MAAO,OAAO,aAAa,cAAc,OAAO,UAAU;AAAA,IACzE,GAAG;AAAA,EAAA,CACJ;AACH;;;;;;;;;"}

dist/cjs/index.d.cts

 import { Virtualizer, PartialKeys, VirtualizerOptions } from '@tanstack/virtual-core';
 export * from '@tanstack/virtual-core';
-export declare function useVirtualizer<TScrollElement extends Element, TItemElement extends Element>(options: PartialKeys<VirtualizerOptions<TScrollElement, TItemElement>, 'observeElementRect' | 'observeElementOffset' | 'scrollToFn'>): Virtualizer<TScrollElement, TItemElement>;
-export declare function useWindowVirtualizer<TItemElement extends Element>(options: PartialKeys<VirtualizerOptions<Window, TItemElement>, 'getScrollElement' | 'observeElementRect' | 'observeElementOffset' | 'scrollToFn'>): Virtualizer<Window, TItemElement>;
+export type ReactVirtualizerOptions<TScrollElement extends Element | Window, TItemElement extends Element> = VirtualizerOptions<TScrollElement, TItemElement> & {
+    useFlushSync?: boolean;
+};
+export declare function useVirtualizer<TScrollElement extends Element, TItemElement extends Element>(options: PartialKeys<ReactVirtualizerOptions<TScrollElement, TItemElement>, 'observeElementRect' | 'observeElementOffset' | 'scrollToFn'>): Virtualizer<TScrollElement, TItemElement>;
+export declare function useWindowVirtualizer<TItemElement extends Element>(options: PartialKeys<ReactVirtualizerOptions<Window, TItemElement>, 'getScrollElement' | 'observeElementRect' | 'observeElementOffset' | 'scrollToFn'>): Virtualizer<Window, TItemElement>;

dist/esm/index.d.ts

 import { Virtualizer, PartialKeys, VirtualizerOptions } from '@tanstack/virtual-core';
 export * from '@tanstack/virtual-core';
-export declare function useVirtualizer<TScrollElement extends Element, TItemElement extends Element>(options: PartialKeys<VirtualizerOptions<TScrollElement, TItemElement>, 'observeElementRect' | 'observeElementOffset' | 'scrollToFn'>): Virtualizer<TScrollElement, TItemElement>;
-export declare function useWindowVirtualizer<TItemElement extends Element>(options: PartialKeys<VirtualizerOptions<Window, TItemElement>, 'getScrollElement' | 'observeElementRect' | 'observeElementOffset' | 'scrollToFn'>): Virtualizer<Window, TItemElement>;
+export type ReactVirtualizerOptions<TScrollElement extends Element | Window, TItemElement extends Element> = VirtualizerOptions<TScrollElement, TItemElement> & {
+    useFlushSync?: boolean;
+};
+export declare function useVirtualizer<TScrollElement extends Element, TItemElement extends Element>(options: PartialKeys<ReactVirtualizerOptions<TScrollElement, TItemElement>, 'observeElementRect' | 'observeElementOffset' | 'scrollToFn'>): Virtualizer<TScrollElement, TItemElement>;
+export declare function useWindowVirtualizer<TItemElement extends Element>(options: PartialKeys<ReactVirtualizerOptions<Window, TItemElement>, 'getScrollElement' | 'observeElementRect' | 'observeElementOffset' | 'scrollToFn'>): Virtualizer<Window, TItemElement>;

dist/esm/index.js

@@ -6,3 +6,6 @@ import * as React from "react";
 const useIsomorphicLayoutEffect = typeof document !== "undefined" ? React.useLayoutEffect : React.useEffect;
-function useVirtualizerBase(options) {
+function useVirtualizerBase({
+  useFlushSync = true,
+  ...options
+}) {
   const rerender = React.useReducer(() => ({}), {})[1];
@@ -13,3 +16,3 @@ const resolvedOptions = {
       var _a;
-      if (sync) {
+      if (useFlushSync && sync) {
         flushSync(rerender);
@@ -16,0 +19,0 @@ } else {

dist/esm/index.js.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"index.js","sources":["../../src/index.tsx"],"sourcesContent":["import * as React from 'react'\nimport { flushSync } from 'react-dom'\nimport {\n  Virtualizer,\n  elementScroll,\n  observeElementOffset,\n  observeElementRect,\n  observeWindowOffset,\n  observeWindowRect,\n  windowScroll,\n} from '@tanstack/virtual-core'\nimport type { PartialKeys, VirtualizerOptions } from '@tanstack/virtual-core'\n\nexport * from '@tanstack/virtual-core'\n\nconst useIsomorphicLayoutEffect =\n  typeof document !== 'undefined' ? React.useLayoutEffect : React.useEffect\n\nfunction useVirtualizerBase<\n  TScrollElement extends Element | Window,\n  TItemElement extends Element,\n>(\n  options: VirtualizerOptions<TScrollElement, TItemElement>,\n): Virtualizer<TScrollElement, TItemElement> {\n  const rerender = React.useReducer(() => ({}), {})[1]\n\n  const resolvedOptions: VirtualizerOptions<TScrollElement, TItemElement> = {\n    ...options,\n    onChange: (instance, sync) => {\n      if (sync) {\n        flushSync(rerender)\n      } else {\n        rerender()\n      }\n      options.onChange?.(instance, sync)\n    },\n  }\n\n  const [instance] = React.useState(\n    () => new Virtualizer<TScrollElement, TItemElement>(resolvedOptions),\n  )\n\n  instance.setOptions(resolvedOptions)\n\n  useIsomorphicLayoutEffect(() => {\n    return instance._didMount()\n  }, [])\n\n  useIsomorphicLayoutEffect(() => {\n    return instance._willUpdate()\n  })\n\n  return instance\n}\n\nexport function useVirtualizer<\n  TScrollElement extends Element,\n  TItemElement extends Element,\n>(\n  options: PartialKeys<\n    VirtualizerOptions<TScrollElement, TItemElement>,\n    'observeElementRect' | 'observeElementOffset' | 'scrollToFn'\n  >,\n): Virtualizer<TScrollElement, TItemElement> {\n  return useVirtualizerBase<TScrollElement, TItemElement>({\n    observeElementRect: observeElementRect,\n    observeElementOffset: observeElementOffset,\n    scrollToFn: elementScroll,\n    ...options,\n  })\n}\n\nexport function useWindowVirtualizer<TItemElement extends Element>(\n  options: PartialKeys<\n    VirtualizerOptions<Window, TItemElement>,\n    | 'getScrollElement'\n    | 'observeElementRect'\n    | 'observeElementOffset'\n    | 'scrollToFn'\n  >,\n): Virtualizer<Window, TItemElement> {\n  return useVirtualizerBase<Window, TItemElement>({\n    getScrollElement: () => (typeof document !== 'undefined' ? window : null),\n    observeElementRect: observeWindowRect,\n    observeElementOffset: observeWindowOffset,\n    scrollToFn: windowScroll,\n    initialOffset: () => (typeof document !== 'undefined' ? window.scrollY : 0),\n    ...options,\n  })\n}\n"],"names":["instance"],"mappings":";;;;AAeA,MAAM,4BACJ,OAAO,aAAa,cAAc,MAAM,kBAAkB,MAAM;AAElE,SAAS,mBAIP,SAC2C;AAC3C,QAAM,WAAW,MAAM,WAAW,OAAO,CAAA,IAAK,CAAA,CAAE,EAAE,CAAC;AAEnD,QAAM,kBAAoE;AAAA,IACxE,GAAG;AAAA,IACH,UAAU,CAACA,WAAU,SAAS;;AAC5B,UAAI,MAAM;AACR,kBAAU,QAAQ;AAAA,MACpB,OAAO;AACL,iBAAA;AAAA,MACF;AACA,oBAAQ,aAAR,iCAAmBA,WAAU;AAAA,IAC/B;AAAA,EAAA;AAGF,QAAM,CAAC,QAAQ,IAAI,MAAM;AAAA,IACvB,MAAM,IAAI,YAA0C,eAAe;AAAA,EAAA;AAGrE,WAAS,WAAW,eAAe;AAEnC,4BAA0B,MAAM;AAC9B,WAAO,SAAS,UAAA;AAAA,EAClB,GAAG,CAAA,CAAE;AAEL,4BAA0B,MAAM;AAC9B,WAAO,SAAS,YAAA;AAAA,EAClB,CAAC;AAED,SAAO;AACT;AAEO,SAAS,eAId,SAI2C;AAC3C,SAAO,mBAAiD;AAAA,IACtD;AAAA,IACA;AAAA,IACA,YAAY;AAAA,IACZ,GAAG;AAAA,EAAA,CACJ;AACH;AAEO,SAAS,qBACd,SAOmC;AACnC,SAAO,mBAAyC;AAAA,IAC9C,kBAAkB,MAAO,OAAO,aAAa,cAAc,SAAS;AAAA,IACpE,oBAAoB;AAAA,IACpB,sBAAsB;AAAA,IACtB,YAAY;AAAA,IACZ,eAAe,MAAO,OAAO,aAAa,cAAc,OAAO,UAAU;AAAA,IACzE,GAAG;AAAA,EAAA,CACJ;AACH;"}
+{"version":3,"file":"index.js","sources":["../../src/index.tsx"],"sourcesContent":["import * as React from 'react'\nimport { flushSync } from 'react-dom'\nimport {\n  Virtualizer,\n  elementScroll,\n  observeElementOffset,\n  observeElementRect,\n  observeWindowOffset,\n  observeWindowRect,\n  windowScroll,\n} from '@tanstack/virtual-core'\nimport type { PartialKeys, VirtualizerOptions } from '@tanstack/virtual-core'\n\nexport * from '@tanstack/virtual-core'\n\nconst useIsomorphicLayoutEffect =\n  typeof document !== 'undefined' ? React.useLayoutEffect : React.useEffect\n\nexport type ReactVirtualizerOptions<\n  TScrollElement extends Element | Window,\n  TItemElement extends Element,\n> = VirtualizerOptions<TScrollElement, TItemElement> & {\n  useFlushSync?: boolean\n}\n\nfunction useVirtualizerBase<\n  TScrollElement extends Element | Window,\n  TItemElement extends Element,\n>({\n  useFlushSync = true,\n  ...options\n}: ReactVirtualizerOptions<TScrollElement, TItemElement>): Virtualizer<\n  TScrollElement,\n  TItemElement\n> {\n  const rerender = React.useReducer(() => ({}), {})[1]\n\n  const resolvedOptions: VirtualizerOptions<TScrollElement, TItemElement> = {\n    ...options,\n    onChange: (instance, sync) => {\n      if (useFlushSync && sync) {\n        flushSync(rerender)\n      } else {\n        rerender()\n      }\n      options.onChange?.(instance, sync)\n    },\n  }\n\n  const [instance] = React.useState(\n    () => new Virtualizer<TScrollElement, TItemElement>(resolvedOptions),\n  )\n\n  instance.setOptions(resolvedOptions)\n\n  useIsomorphicLayoutEffect(() => {\n    return instance._didMount()\n  }, [])\n\n  useIsomorphicLayoutEffect(() => {\n    return instance._willUpdate()\n  })\n\n  return instance\n}\n\nexport function useVirtualizer<\n  TScrollElement extends Element,\n  TItemElement extends Element,\n>(\n  options: PartialKeys<\n    ReactVirtualizerOptions<TScrollElement, TItemElement>,\n    'observeElementRect' | 'observeElementOffset' | 'scrollToFn'\n  >,\n): Virtualizer<TScrollElement, TItemElement> {\n  return useVirtualizerBase<TScrollElement, TItemElement>({\n    observeElementRect: observeElementRect,\n    observeElementOffset: observeElementOffset,\n    scrollToFn: elementScroll,\n    ...options,\n  })\n}\n\nexport function useWindowVirtualizer<TItemElement extends Element>(\n  options: PartialKeys<\n    ReactVirtualizerOptions<Window, TItemElement>,\n    | 'getScrollElement'\n    | 'observeElementRect'\n    | 'observeElementOffset'\n    | 'scrollToFn'\n  >,\n): Virtualizer<Window, TItemElement> {\n  return useVirtualizerBase<Window, TItemElement>({\n    getScrollElement: () => (typeof document !== 'undefined' ? window : null),\n    observeElementRect: observeWindowRect,\n    observeElementOffset: observeWindowOffset,\n    scrollToFn: windowScroll,\n    initialOffset: () => (typeof document !== 'undefined' ? window.scrollY : 0),\n    ...options,\n  })\n}\n"],"names":["instance"],"mappings":";;;;AAeA,MAAM,4BACJ,OAAO,aAAa,cAAc,MAAM,kBAAkB,MAAM;AASlE,SAAS,mBAGP;AAAA,EACA,eAAe;AAAA,EACf,GAAG;AACL,GAGE;AACA,QAAM,WAAW,MAAM,WAAW,OAAO,CAAA,IAAK,CAAA,CAAE,EAAE,CAAC;AAEnD,QAAM,kBAAoE;AAAA,IACxE,GAAG;AAAA,IACH,UAAU,CAACA,WAAU,SAAS;;AAC5B,UAAI,gBAAgB,MAAM;AACxB,kBAAU,QAAQ;AAAA,MACpB,OAAO;AACL,iBAAA;AAAA,MACF;AACA,oBAAQ,aAAR,iCAAmBA,WAAU;AAAA,IAC/B;AAAA,EAAA;AAGF,QAAM,CAAC,QAAQ,IAAI,MAAM;AAAA,IACvB,MAAM,IAAI,YAA0C,eAAe;AAAA,EAAA;AAGrE,WAAS,WAAW,eAAe;AAEnC,4BAA0B,MAAM;AAC9B,WAAO,SAAS,UAAA;AAAA,EAClB,GAAG,CAAA,CAAE;AAEL,4BAA0B,MAAM;AAC9B,WAAO,SAAS,YAAA;AAAA,EAClB,CAAC;AAED,SAAO;AACT;AAEO,SAAS,eAId,SAI2C;AAC3C,SAAO,mBAAiD;AAAA,IACtD;AAAA,IACA;AAAA,IACA,YAAY;AAAA,IACZ,GAAG;AAAA,EAAA,CACJ;AACH;AAEO,SAAS,qBACd,SAOmC;AACnC,SAAO,mBAAyC;AAAA,IAC9C,kBAAkB,MAAO,OAAO,aAAa,cAAc,SAAS;AAAA,IACpE,oBAAoB;AAAA,IACpB,sBAAsB;AAAA,IACtB,YAAY;AAAA,IACZ,eAAe,MAAO,OAAO,aAAa,cAAc,OAAO,UAAU;AAAA,IACzE,GAAG;AAAA,EAAA,CACJ;AACH;"}

package.json

 {
   "name": "@tanstack/react-virtual",
-  "version": "3.13.14",
+  "version": "3.13.15",
   "description": "Headless UI for virtualizing scrollable elements in React",
@@ -48,3 +48,3 @@ "author": "Tanner Linsley",
   "dependencies": {
-    "@tanstack/virtual-core": "3.13.14"
+    "@tanstack/virtual-core": "3.13.15"
   },
@@ -72,4 +72,4 @@ "devDependencies": {
     "build": "vite build",
-    "test:e2e": "playwright test"
+    "test:e2e": "../../node_modules/.bin/playwright test"
   }
 }

src/index.tsx

@@ -19,8 +19,19 @@ import * as React from 'react'
 
+export type ReactVirtualizerOptions<
+  TScrollElement extends Element | Window,
+  TItemElement extends Element,
+> = VirtualizerOptions<TScrollElement, TItemElement> & {
+  useFlushSync?: boolean
+}
+
 function useVirtualizerBase<
   TScrollElement extends Element | Window,
   TItemElement extends Element,
->(
-  options: VirtualizerOptions<TScrollElement, TItemElement>,
-): Virtualizer<TScrollElement, TItemElement> {
+>({
+  useFlushSync = true,
+  ...options
+}: ReactVirtualizerOptions<TScrollElement, TItemElement>): Virtualizer<
+  TScrollElement,
+  TItemElement
+> {
   const rerender = React.useReducer(() => ({}), {})[1]
@@ -31,3 +42,3 @@
     onChange: (instance, sync) => {
-      if (sync) {
+      if (useFlushSync && sync) {
         flushSync(rerender)
@@ -63,3 +74,3 @@ } else {
   options: PartialKeys<
-    VirtualizerOptions<TScrollElement, TItemElement>,
+    ReactVirtualizerOptions<TScrollElement, TItemElement>,
     'observeElementRect' | 'observeElementOffset' | 'scrollToFn'
@@ -78,3 +89,3 @@ >,
   options: PartialKeys<
-    VirtualizerOptions<Window, TItemElement>,
+    ReactVirtualizerOptions<Window, TItemElement>,
     | 'getScrollElement'
@@ -81,0 +92,0 @@ | 'observeElementRect'

No alert changes

Improved metrics

Total package byte prevSize

19810

7.68%

Lines of code

233

8.88%

Dependency changes

• + Added

  @tanstack/virtual-core@3.13.15
  (transitive)

• - Removed

  @tanstack/virtual-core@3.13.14
  (transitive)

• Updated

  @tanstack/virtual-core@3.13.15