@fluentui/react-virtualizer 9.0.0-alpha.87 → 9.0.0-alpha.88

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (59) hide show
  1. package/CHANGELOG.md +17 -5
  2. package/dist/index.d.ts +21 -22
  3. package/lib/components/Virtualizer/Virtualizer.js +1 -0
  4. package/lib/components/Virtualizer/Virtualizer.js.map +1 -1
  5. package/lib/components/Virtualizer/Virtualizer.types.js.map +1 -1
  6. package/lib/components/Virtualizer/renderVirtualizer.js.map +1 -1
  7. package/lib/components/Virtualizer/useVirtualizer.js +53 -45
  8. package/lib/components/Virtualizer/useVirtualizer.js.map +1 -1
  9. package/lib/components/VirtualizerScrollView/VirtualizerScrollView.types.js +1 -1
  10. package/lib/components/VirtualizerScrollView/VirtualizerScrollView.types.js.map +1 -1
  11. package/lib/components/VirtualizerScrollView/useVirtualizerScrollView.js +1 -2
  12. package/lib/components/VirtualizerScrollView/useVirtualizerScrollView.js.map +1 -1
  13. package/lib/components/VirtualizerScrollViewDynamic/VirtualizerScrollViewDynamic.types.js +1 -1
  14. package/lib/components/VirtualizerScrollViewDynamic/VirtualizerScrollViewDynamic.types.js.map +1 -1
  15. package/lib/components/VirtualizerScrollViewDynamic/useVirtualizerScrollViewDynamic.js +2 -3
  16. package/lib/components/VirtualizerScrollViewDynamic/useVirtualizerScrollViewDynamic.js.map +1 -1
  17. package/lib/hooks/hooks.types.js +1 -4
  18. package/lib/hooks/hooks.types.js.map +1 -1
  19. package/lib/hooks/useDynamicPagination.js +2 -3
  20. package/lib/hooks/useDynamicPagination.js.map +1 -1
  21. package/lib/hooks/useIntersectionObserver.js.map +1 -1
  22. package/lib/hooks/useMeasureList.js +1 -2
  23. package/lib/hooks/useMeasureList.js.map +1 -1
  24. package/lib/hooks/useMutationObserver.js.map +1 -1
  25. package/lib/hooks/useStaticPagination.js +2 -3
  26. package/lib/hooks/useStaticPagination.js.map +1 -1
  27. package/lib/utilities/ImperativeScrolling/imperativeScrolling.types.js +1 -1
  28. package/lib/utilities/ImperativeScrolling/imperativeScrolling.types.js.map +1 -1
  29. package/lib/utilities/VirtualizerContext/VirtualizerContext.js +3 -4
  30. package/lib/utilities/VirtualizerContext/VirtualizerContext.js.map +1 -1
  31. package/lib-commonjs/components/Virtualizer/Virtualizer.js +2 -0
  32. package/lib-commonjs/components/Virtualizer/Virtualizer.js.map +1 -1
  33. package/lib-commonjs/components/Virtualizer/Virtualizer.types.js.map +1 -1
  34. package/lib-commonjs/components/Virtualizer/renderVirtualizer.js.map +1 -1
  35. package/lib-commonjs/components/Virtualizer/useVirtualizer.js +54 -45
  36. package/lib-commonjs/components/Virtualizer/useVirtualizer.js.map +1 -1
  37. package/lib-commonjs/components/VirtualizerScrollView/VirtualizerScrollView.types.js +2 -0
  38. package/lib-commonjs/components/VirtualizerScrollView/VirtualizerScrollView.types.js.map +1 -1
  39. package/lib-commonjs/components/VirtualizerScrollView/useVirtualizerScrollView.js +1 -1
  40. package/lib-commonjs/components/VirtualizerScrollView/useVirtualizerScrollView.js.map +1 -1
  41. package/lib-commonjs/components/VirtualizerScrollViewDynamic/VirtualizerScrollViewDynamic.types.js +2 -0
  42. package/lib-commonjs/components/VirtualizerScrollViewDynamic/VirtualizerScrollViewDynamic.types.js.map +1 -1
  43. package/lib-commonjs/components/VirtualizerScrollViewDynamic/useVirtualizerScrollViewDynamic.js +2 -2
  44. package/lib-commonjs/components/VirtualizerScrollViewDynamic/useVirtualizerScrollViewDynamic.js.map +1 -1
  45. package/lib-commonjs/hooks/hooks.types.js +3 -4
  46. package/lib-commonjs/hooks/hooks.types.js.map +1 -1
  47. package/lib-commonjs/hooks/useDynamicPagination.js +2 -2
  48. package/lib-commonjs/hooks/useDynamicPagination.js.map +1 -1
  49. package/lib-commonjs/hooks/useIntersectionObserver.js.map +1 -1
  50. package/lib-commonjs/hooks/useMeasureList.js +1 -1
  51. package/lib-commonjs/hooks/useMeasureList.js.map +1 -1
  52. package/lib-commonjs/hooks/useMutationObserver.js.map +1 -1
  53. package/lib-commonjs/hooks/useStaticPagination.js +2 -2
  54. package/lib-commonjs/hooks/useStaticPagination.js.map +1 -1
  55. package/lib-commonjs/utilities/ImperativeScrolling/imperativeScrolling.types.js +2 -0
  56. package/lib-commonjs/utilities/ImperativeScrolling/imperativeScrolling.types.js.map +1 -1
  57. package/lib-commonjs/utilities/VirtualizerContext/VirtualizerContext.js +3 -3
  58. package/lib-commonjs/utilities/VirtualizerContext/VirtualizerContext.js.map +1 -1
  59. package/package.json +4 -4
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/hooks/useMutationObserver.ts"],"sourcesContent":["import type { MutableRefObject } from 'react';\nimport * as React from 'react';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\n\nconst { useRef, useEffect } = React;\n\nexport const useMutationObserver = (\n target: Element | Document | undefined,\n callback: MutationCallback,\n options?: MutationObserverInit,\n): {\n observer: MutableRefObject<MutationObserver | undefined>; // eslint-disable-line no-restricted-globals\n} => {\n 'use no memo';\n\n // TODO: exclude types from this lint rule: https://github.com/microsoft/fluentui/issues/31286\n // eslint-disable-next-line no-restricted-globals\n const observer = useRef<MutationObserver>();\n const { targetDocument } = useFluent();\n const win = targetDocument?.defaultView;\n\n useEffect(() => {\n if (!win) {\n return;\n }\n // Create an observer instance linked to the callback function\n observer.current = new win.MutationObserver(callback);\n }, [callback, win]);\n\n useEffect(() => {\n if (target) {\n // Start observing the target node for configured mutations\n observer.current?.observe(target, options);\n }\n\n return () => {\n observer.current?.disconnect();\n };\n }, [target, options]);\n\n return { observer };\n};\n"],"names":["React","useFluent_unstable","useFluent","useRef","useEffect","useMutationObserver","target","callback","options","observer","targetDocument","win","defaultView","current","MutationObserver","observe","disconnect"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AACA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,sBAAsBC,SAAS,QAAQ,kCAAkC;AAElF,MAAM,EAAEC,MAAM,EAAEC,SAAS,EAAE,GAAGJ;AAE9B,OAAO,MAAMK,sBAAsB,CACjCC,QACAC,UACAC;IAIA;IAEA,8FAA8F;IAC9F,iDAAiD;IACjD,MAAMC,WAAWN;IACjB,MAAM,EAAEO,cAAc,EAAE,GAAGR;IAC3B,MAAMS,MAAMD,2BAAAA,qCAAAA,eAAgBE,WAAW;IAEvCR,UAAU;QACR,IAAI,CAACO,KAAK;YACR;QACF;QACA,8DAA8D;QAC9DF,SAASI,OAAO,GAAG,IAAIF,IAAIG,gBAAgB,CAACP;IAC9C,GAAG;QAACA;QAAUI;KAAI;IAElBP,UAAU;QACR,IAAIE,QAAQ;gBACV,2DAA2D;YAC3DG;aAAAA,oBAAAA,SAASI,OAAO,cAAhBJ,wCAAAA,kBAAkBM,OAAO,CAACT,QAAQE;QACpC;QAEA,OAAO;gBACLC;aAAAA,oBAAAA,SAASI,OAAO,cAAhBJ,wCAAAA,kBAAkBO,UAAU;QAC9B;IACF,GAAG;QAACV;QAAQE;KAAQ;IAEpB,OAAO;QAAEC;IAAS;AACpB,EAAE"}
1
+ {"version":3,"sources":["../src/hooks/useMutationObserver.ts"],"sourcesContent":["import * as React from 'react';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\n\nconst { useRef, useEffect } = React;\n\nexport const useMutationObserver = (\n target: Element | Document | undefined,\n callback: MutationCallback,\n options?: MutationObserverInit,\n): {\n observer: React.MutableRefObject<MutationObserver | undefined>; // eslint-disable-line no-restricted-globals\n} => {\n 'use no memo';\n\n // TODO: exclude types from this lint rule: https://github.com/microsoft/fluentui/issues/31286\n // eslint-disable-next-line no-restricted-globals\n const observer = useRef<MutationObserver>();\n const { targetDocument } = useFluent();\n const win = targetDocument?.defaultView;\n\n useEffect(() => {\n if (!win) {\n return;\n }\n // Create an observer instance linked to the callback function\n observer.current = new win.MutationObserver(callback);\n }, [callback, win]);\n\n useEffect(() => {\n if (target) {\n // Start observing the target node for configured mutations\n observer.current?.observe(target, options);\n }\n\n return () => {\n observer.current?.disconnect();\n };\n }, [target, options]);\n\n return { observer };\n};\n"],"names":["React","useFluent_unstable","useFluent","useRef","useEffect","useMutationObserver","target","callback","options","observer","targetDocument","win","defaultView","current","MutationObserver","observe","disconnect"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,sBAAsBC,SAAS,QAAQ,kCAAkC;AAElF,MAAM,EAAEC,MAAM,EAAEC,SAAS,EAAE,GAAGJ;AAE9B,OAAO,MAAMK,sBAAsB,CACjCC,QACAC,UACAC;IAIA;IAEA,8FAA8F;IAC9F,iDAAiD;IACjD,MAAMC,WAAWN;IACjB,MAAM,EAAEO,cAAc,EAAE,GAAGR;IAC3B,MAAMS,MAAMD,2BAAAA,qCAAAA,eAAgBE,WAAW;IAEvCR,UAAU;QACR,IAAI,CAACO,KAAK;YACR;QACF;QACA,8DAA8D;QAC9DF,SAASI,OAAO,GAAG,IAAIF,IAAIG,gBAAgB,CAACP;IAC9C,GAAG;QAACA;QAAUI;KAAI;IAElBP,UAAU;QACR,IAAIE,QAAQ;gBACV,2DAA2D;YAC3DG;aAAAA,oBAAAA,SAASI,OAAO,cAAhBJ,wCAAAA,kBAAkBM,OAAO,CAACT,QAAQE;QACpC;QAEA,OAAO;gBACLC;aAAAA,oBAAAA,SAASI,OAAO,cAAhBJ,wCAAAA,kBAAkBO,UAAU;QAC9B;IACF,GAAG;QAACV;QAAQE;KAAQ;IAEpB,OAAO;QAAEC;IAAS;AACpB,EAAE"}
@@ -1,5 +1,4 @@
1
1
  import * as React from 'react';
2
- import { useRef } from 'react';
3
2
  import { useTimeout } from '@fluentui/react-utilities';
4
3
  /**
5
4
  * Optional hook that will enable pagination on the virtualizer so that it 'autoscrolls' to an items exact position
@@ -10,8 +9,8 @@ import { useTimeout } from '@fluentui/react-utilities';
10
9
  'use no memo';
11
10
  const { itemSize, axis = 'vertical' } = virtualizerProps;
12
11
  const [setScrollTimer, clearScrollTimer] = useTimeout();
13
- const lastScrollPos = useRef(0);
14
- const lastIndexScrolled = useRef(0);
12
+ const lastScrollPos = React.useRef(0);
13
+ const lastIndexScrolled = React.useRef(0);
15
14
  const scrollContainer = React.useRef(null);
16
15
  const clearListeners = ()=>{
17
16
  if (scrollContainer.current) {
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/hooks/useStaticPagination.ts"],"sourcesContent":["import * as React from 'react';\nimport { VirtualizerStaticPaginationProps } from './hooks.types';\nimport { useRef } from 'react';\nimport { useTimeout } from '@fluentui/react-utilities';\n\n/**\n * Optional hook that will enable pagination on the virtualizer so that it 'autoscrolls' to an items exact position\n * Sizes are uniform/static, we round to the nearest item on long scrolls\n * On short scrolls, we will go at minimum to the next/previous item so that arrow pagination works\n * All VirtualizerStaticPaginationProps can be grabbed from Virtualizer hooks externally and passed in\n */\nexport const useStaticVirtualizerPagination = (\n virtualizerProps: VirtualizerStaticPaginationProps,\n paginationEnabled: Boolean = true,\n) => {\n 'use no memo';\n\n const { itemSize, axis = 'vertical' } = virtualizerProps;\n\n const [setScrollTimer, clearScrollTimer] = useTimeout();\n const lastScrollPos = useRef<number>(0);\n const lastIndexScrolled = useRef<number>(0);\n\n const scrollContainer = React.useRef<HTMLElement | null>(null);\n\n const clearListeners = () => {\n if (scrollContainer.current) {\n scrollContainer.current.removeEventListener('scroll', onScroll);\n\n scrollContainer.current = null;\n clearScrollTimer();\n }\n };\n\n React.useEffect(() => {\n return () => {\n clearListeners();\n };\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n /**\n * Handle scroll stop event and paginate to the closest item\n * If the closest item is the same as the previous scroll end\n * we paginate to the next/previous one based on direction\n */\n const onScrollEnd = React.useCallback(() => {\n if (!scrollContainer.current || !paginationEnabled) {\n // No container found\n return;\n }\n\n const currentScrollPos = Math.round(\n axis === 'vertical' ? scrollContainer.current.scrollTop : scrollContainer.current.scrollLeft,\n );\n const closestItem = Math.round(currentScrollPos / itemSize);\n\n let nextItem = 0;\n if (Math.round(closestItem - lastIndexScrolled.current) === 0) {\n // Special case for go to next/previous with minimum amount of scroll needed\n const nextTarget = lastScrollPos.current < currentScrollPos ? 1 : -1;\n const isSecondaryScroll = lastScrollPos.current === currentScrollPos;\n const posMod = isSecondaryScroll ? 0 : nextTarget;\n\n nextItem = closestItem + posMod;\n } else {\n // Pagination for anything else can just jump to the closest!\n nextItem = closestItem;\n }\n\n const nextItemPos = nextItem * itemSize;\n\n if (axis === 'vertical') {\n scrollContainer.current.scrollTo({ top: nextItemPos, behavior: 'smooth' });\n } else {\n scrollContainer.current.scrollTo({ left: nextItemPos, behavior: 'smooth' });\n }\n lastScrollPos.current = nextItemPos;\n lastIndexScrolled.current = nextItem;\n }, [paginationEnabled, axis, itemSize]);\n\n /**\n * On scroll timer that will continuously delay callback until scrolling stops\n */\n const onScroll = React.useCallback(\n event => {\n clearScrollTimer();\n setScrollTimer(onScrollEnd, 100);\n },\n [onScrollEnd, clearScrollTimer, setScrollTimer],\n );\n\n /**\n * Pagination ref will ensure we attach listeners to containers on change\n * It is returned from hook and merged into the scroll container externally\n */\n const paginationRef = React.useCallback(\n (instance: HTMLElement | HTMLDivElement | null) => {\n if (!paginationEnabled) {\n clearListeners();\n scrollContainer.current = null;\n return;\n }\n if (scrollContainer.current !== instance) {\n clearListeners();\n\n scrollContainer.current = instance;\n if (scrollContainer.current) {\n scrollContainer.current.addEventListener('scroll', onScroll);\n }\n }\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [onScroll, onScrollEnd, paginationEnabled],\n );\n\n return paginationRef;\n};\n"],"names":["React","useRef","useTimeout","useStaticVirtualizerPagination","virtualizerProps","paginationEnabled","itemSize","axis","setScrollTimer","clearScrollTimer","lastScrollPos","lastIndexScrolled","scrollContainer","clearListeners","current","removeEventListener","onScroll","useEffect","onScrollEnd","useCallback","currentScrollPos","Math","round","scrollTop","scrollLeft","closestItem","nextItem","nextTarget","isSecondaryScroll","posMod","nextItemPos","scrollTo","top","behavior","left","event","paginationRef","instance","addEventListener"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,MAAM,QAAQ,QAAQ;AAC/B,SAASC,UAAU,QAAQ,4BAA4B;AAEvD;;;;;CAKC,GACD,OAAO,MAAMC,iCAAiC,CAC5CC,kBACAC,oBAA6B,IAAI;IAEjC;IAEA,MAAM,EAAEC,QAAQ,EAAEC,OAAO,UAAU,EAAE,GAAGH;IAExC,MAAM,CAACI,gBAAgBC,iBAAiB,GAAGP;IAC3C,MAAMQ,gBAAgBT,OAAe;IACrC,MAAMU,oBAAoBV,OAAe;IAEzC,MAAMW,kBAAkBZ,MAAMC,MAAM,CAAqB;IAEzD,MAAMY,iBAAiB;QACrB,IAAID,gBAAgBE,OAAO,EAAE;YAC3BF,gBAAgBE,OAAO,CAACC,mBAAmB,CAAC,UAAUC;YAEtDJ,gBAAgBE,OAAO,GAAG;YAC1BL;QACF;IACF;IAEAT,MAAMiB,SAAS,CAAC;QACd,OAAO;YACLJ;QACF;IACA,uDAAuD;IACzD,GAAG,EAAE;IAEL;;;;GAIC,GACD,MAAMK,cAAclB,MAAMmB,WAAW,CAAC;QACpC,IAAI,CAACP,gBAAgBE,OAAO,IAAI,CAACT,mBAAmB;YAClD,qBAAqB;YACrB;QACF;QAEA,MAAMe,mBAAmBC,KAAKC,KAAK,CACjCf,SAAS,aAAaK,gBAAgBE,OAAO,CAACS,SAAS,GAAGX,gBAAgBE,OAAO,CAACU,UAAU;QAE9F,MAAMC,cAAcJ,KAAKC,KAAK,CAACF,mBAAmBd;QAElD,IAAIoB,WAAW;QACf,IAAIL,KAAKC,KAAK,CAACG,cAAcd,kBAAkBG,OAAO,MAAM,GAAG;YAC7D,4EAA4E;YAC5E,MAAMa,aAAajB,cAAcI,OAAO,GAAGM,mBAAmB,IAAI,CAAC;YACnE,MAAMQ,oBAAoBlB,cAAcI,OAAO,KAAKM;YACpD,MAAMS,SAASD,oBAAoB,IAAID;YAEvCD,WAAWD,cAAcI;QAC3B,OAAO;YACL,6DAA6D;YAC7DH,WAAWD;QACb;QAEA,MAAMK,cAAcJ,WAAWpB;QAE/B,IAAIC,SAAS,YAAY;YACvBK,gBAAgBE,OAAO,CAACiB,QAAQ,CAAC;gBAAEC,KAAKF;gBAAaG,UAAU;YAAS;QAC1E,OAAO;YACLrB,gBAAgBE,OAAO,CAACiB,QAAQ,CAAC;gBAAEG,MAAMJ;gBAAaG,UAAU;YAAS;QAC3E;QACAvB,cAAcI,OAAO,GAAGgB;QACxBnB,kBAAkBG,OAAO,GAAGY;IAC9B,GAAG;QAACrB;QAAmBE;QAAMD;KAAS;IAEtC;;GAEC,GACD,MAAMU,WAAWhB,MAAMmB,WAAW,CAChCgB,CAAAA;QACE1B;QACAD,eAAeU,aAAa;IAC9B,GACA;QAACA;QAAaT;QAAkBD;KAAe;IAGjD;;;GAGC,GACD,MAAM4B,gBAAgBpC,MAAMmB,WAAW,CACrC,CAACkB;QACC,IAAI,CAAChC,mBAAmB;YACtBQ;YACAD,gBAAgBE,OAAO,GAAG;YAC1B;QACF;QACA,IAAIF,gBAAgBE,OAAO,KAAKuB,UAAU;YACxCxB;YAEAD,gBAAgBE,OAAO,GAAGuB;YAC1B,IAAIzB,gBAAgBE,OAAO,EAAE;gBAC3BF,gBAAgBE,OAAO,CAACwB,gBAAgB,CAAC,UAAUtB;YACrD;QACF;IACF,GACA,uDAAuD;IACvD;QAACA;QAAUE;QAAab;KAAkB;IAG5C,OAAO+B;AACT,EAAE"}
1
+ {"version":3,"sources":["../src/hooks/useStaticPagination.ts"],"sourcesContent":["import * as React from 'react';\nimport { VirtualizerStaticPaginationProps } from './hooks.types';\nimport { useTimeout } from '@fluentui/react-utilities';\n\n/**\n * Optional hook that will enable pagination on the virtualizer so that it 'autoscrolls' to an items exact position\n * Sizes are uniform/static, we round to the nearest item on long scrolls\n * On short scrolls, we will go at minimum to the next/previous item so that arrow pagination works\n * All VirtualizerStaticPaginationProps can be grabbed from Virtualizer hooks externally and passed in\n */\nexport const useStaticVirtualizerPagination = (\n virtualizerProps: VirtualizerStaticPaginationProps,\n paginationEnabled: Boolean = true,\n) => {\n 'use no memo';\n\n const { itemSize, axis = 'vertical' } = virtualizerProps;\n\n const [setScrollTimer, clearScrollTimer] = useTimeout();\n const lastScrollPos = React.useRef<number>(0);\n const lastIndexScrolled = React.useRef<number>(0);\n\n const scrollContainer = React.useRef<HTMLElement | null>(null);\n\n const clearListeners = () => {\n if (scrollContainer.current) {\n scrollContainer.current.removeEventListener('scroll', onScroll);\n\n scrollContainer.current = null;\n clearScrollTimer();\n }\n };\n\n React.useEffect(() => {\n return () => {\n clearListeners();\n };\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n /**\n * Handle scroll stop event and paginate to the closest item\n * If the closest item is the same as the previous scroll end\n * we paginate to the next/previous one based on direction\n */\n const onScrollEnd = React.useCallback(() => {\n if (!scrollContainer.current || !paginationEnabled) {\n // No container found\n return;\n }\n\n const currentScrollPos = Math.round(\n axis === 'vertical' ? scrollContainer.current.scrollTop : scrollContainer.current.scrollLeft,\n );\n const closestItem = Math.round(currentScrollPos / itemSize);\n\n let nextItem = 0;\n if (Math.round(closestItem - lastIndexScrolled.current) === 0) {\n // Special case for go to next/previous with minimum amount of scroll needed\n const nextTarget = lastScrollPos.current < currentScrollPos ? 1 : -1;\n const isSecondaryScroll = lastScrollPos.current === currentScrollPos;\n const posMod = isSecondaryScroll ? 0 : nextTarget;\n\n nextItem = closestItem + posMod;\n } else {\n // Pagination for anything else can just jump to the closest!\n nextItem = closestItem;\n }\n\n const nextItemPos = nextItem * itemSize;\n\n if (axis === 'vertical') {\n scrollContainer.current.scrollTo({ top: nextItemPos, behavior: 'smooth' });\n } else {\n scrollContainer.current.scrollTo({ left: nextItemPos, behavior: 'smooth' });\n }\n lastScrollPos.current = nextItemPos;\n lastIndexScrolled.current = nextItem;\n }, [paginationEnabled, axis, itemSize]);\n\n /**\n * On scroll timer that will continuously delay callback until scrolling stops\n */\n const onScroll = React.useCallback(\n event => {\n clearScrollTimer();\n setScrollTimer(onScrollEnd, 100);\n },\n [onScrollEnd, clearScrollTimer, setScrollTimer],\n );\n\n /**\n * Pagination ref will ensure we attach listeners to containers on change\n * It is returned from hook and merged into the scroll container externally\n */\n const paginationRef = React.useCallback(\n (instance: HTMLElement | HTMLDivElement | null) => {\n if (!paginationEnabled) {\n clearListeners();\n scrollContainer.current = null;\n return;\n }\n if (scrollContainer.current !== instance) {\n clearListeners();\n\n scrollContainer.current = instance;\n if (scrollContainer.current) {\n scrollContainer.current.addEventListener('scroll', onScroll);\n }\n }\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [onScroll, onScrollEnd, paginationEnabled],\n );\n\n return paginationRef;\n};\n"],"names":["React","useTimeout","useStaticVirtualizerPagination","virtualizerProps","paginationEnabled","itemSize","axis","setScrollTimer","clearScrollTimer","lastScrollPos","useRef","lastIndexScrolled","scrollContainer","clearListeners","current","removeEventListener","onScroll","useEffect","onScrollEnd","useCallback","currentScrollPos","Math","round","scrollTop","scrollLeft","closestItem","nextItem","nextTarget","isSecondaryScroll","posMod","nextItemPos","scrollTo","top","behavior","left","event","paginationRef","instance","addEventListener"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,UAAU,QAAQ,4BAA4B;AAEvD;;;;;CAKC,GACD,OAAO,MAAMC,iCAAiC,CAC5CC,kBACAC,oBAA6B,IAAI;IAEjC;IAEA,MAAM,EAAEC,QAAQ,EAAEC,OAAO,UAAU,EAAE,GAAGH;IAExC,MAAM,CAACI,gBAAgBC,iBAAiB,GAAGP;IAC3C,MAAMQ,gBAAgBT,MAAMU,MAAM,CAAS;IAC3C,MAAMC,oBAAoBX,MAAMU,MAAM,CAAS;IAE/C,MAAME,kBAAkBZ,MAAMU,MAAM,CAAqB;IAEzD,MAAMG,iBAAiB;QACrB,IAAID,gBAAgBE,OAAO,EAAE;YAC3BF,gBAAgBE,OAAO,CAACC,mBAAmB,CAAC,UAAUC;YAEtDJ,gBAAgBE,OAAO,GAAG;YAC1BN;QACF;IACF;IAEAR,MAAMiB,SAAS,CAAC;QACd,OAAO;YACLJ;QACF;IACA,uDAAuD;IACzD,GAAG,EAAE;IAEL;;;;GAIC,GACD,MAAMK,cAAclB,MAAMmB,WAAW,CAAC;QACpC,IAAI,CAACP,gBAAgBE,OAAO,IAAI,CAACV,mBAAmB;YAClD,qBAAqB;YACrB;QACF;QAEA,MAAMgB,mBAAmBC,KAAKC,KAAK,CACjChB,SAAS,aAAaM,gBAAgBE,OAAO,CAACS,SAAS,GAAGX,gBAAgBE,OAAO,CAACU,UAAU;QAE9F,MAAMC,cAAcJ,KAAKC,KAAK,CAACF,mBAAmBf;QAElD,IAAIqB,WAAW;QACf,IAAIL,KAAKC,KAAK,CAACG,cAAcd,kBAAkBG,OAAO,MAAM,GAAG;YAC7D,4EAA4E;YAC5E,MAAMa,aAAalB,cAAcK,OAAO,GAAGM,mBAAmB,IAAI,CAAC;YACnE,MAAMQ,oBAAoBnB,cAAcK,OAAO,KAAKM;YACpD,MAAMS,SAASD,oBAAoB,IAAID;YAEvCD,WAAWD,cAAcI;QAC3B,OAAO;YACL,6DAA6D;YAC7DH,WAAWD;QACb;QAEA,MAAMK,cAAcJ,WAAWrB;QAE/B,IAAIC,SAAS,YAAY;YACvBM,gBAAgBE,OAAO,CAACiB,QAAQ,CAAC;gBAAEC,KAAKF;gBAAaG,UAAU;YAAS;QAC1E,OAAO;YACLrB,gBAAgBE,OAAO,CAACiB,QAAQ,CAAC;gBAAEG,MAAMJ;gBAAaG,UAAU;YAAS;QAC3E;QACAxB,cAAcK,OAAO,GAAGgB;QACxBnB,kBAAkBG,OAAO,GAAGY;IAC9B,GAAG;QAACtB;QAAmBE;QAAMD;KAAS;IAEtC;;GAEC,GACD,MAAMW,WAAWhB,MAAMmB,WAAW,CAChCgB,CAAAA;QACE3B;QACAD,eAAeW,aAAa;IAC9B,GACA;QAACA;QAAaV;QAAkBD;KAAe;IAGjD;;;GAGC,GACD,MAAM6B,gBAAgBpC,MAAMmB,WAAW,CACrC,CAACkB;QACC,IAAI,CAACjC,mBAAmB;YACtBS;YACAD,gBAAgBE,OAAO,GAAG;YAC1B;QACF;QACA,IAAIF,gBAAgBE,OAAO,KAAKuB,UAAU;YACxCxB;YAEAD,gBAAgBE,OAAO,GAAGuB;YAC1B,IAAIzB,gBAAgBE,OAAO,EAAE;gBAC3BF,gBAAgBE,OAAO,CAACwB,gBAAgB,CAAC,UAAUtB;YACrD;QACF;IACF,GACA,uDAAuD;IACvD;QAACA;QAAUE;QAAad;KAAkB;IAG5C,OAAOgC;AACT,EAAE"}
@@ -1 +1 @@
1
- export { };
1
+ import * as React from 'react';
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/utilities/ImperativeScrolling/imperativeScrolling.types.ts"],"sourcesContent":["import type { RefObject } from 'react';\n\nexport type ScrollToItemStaticParams = {\n index: number;\n itemSize: number;\n totalItems: number;\n scrollViewRef: RefObject<HTMLDivElement>;\n axis?: 'horizontal' | 'vertical';\n reversed?: boolean;\n behavior?: ScrollBehavior;\n};\n\nexport type ScrollToItemDynamicParams = {\n index: number;\n itemSizes: RefObject<number[]>;\n totalSize: number;\n scrollViewRef: RefObject<HTMLDivElement>;\n axis?: 'horizontal' | 'vertical';\n reversed?: boolean;\n behavior?: ScrollBehavior;\n};\n\nexport type ScrollToInterface = {\n scrollTo: (index: number, behavior?: ScrollBehavior, callback?: (index: number) => void) => void;\n virtualizerLength: RefObject<number>;\n currentIndex: RefObject<number> | undefined;\n};\n"],"names":[],"rangeMappings":"","mappings":"AAsBA,WAIE"}
1
+ {"version":3,"sources":["../src/utilities/ImperativeScrolling/imperativeScrolling.types.ts"],"sourcesContent":["import * as React from 'react';\n\nexport type ScrollToItemStaticParams = {\n index: number;\n itemSize: number;\n totalItems: number;\n scrollViewRef: React.RefObject<HTMLDivElement>;\n axis?: 'horizontal' | 'vertical';\n reversed?: boolean;\n behavior?: ScrollBehavior;\n};\n\nexport type ScrollToItemDynamicParams = {\n index: number;\n itemSizes: React.RefObject<number[]>;\n totalSize: number;\n scrollViewRef: React.RefObject<HTMLDivElement>;\n axis?: 'horizontal' | 'vertical';\n reversed?: boolean;\n behavior?: ScrollBehavior;\n};\n\nexport type ScrollToInterface = {\n scrollTo: (index: number, behavior?: ScrollBehavior, callback?: (index: number) => void) => void;\n virtualizerLength: React.RefObject<number>;\n currentIndex: React.RefObject<number> | undefined;\n};\n"],"names":["React"],"rangeMappings":"","mappings":"AAAA,YAAYA,WAAW,QAAQ"}
@@ -1,5 +1,4 @@
1
1
  import * as React from 'react';
2
- import { useMemo, useState, useRef } from 'react';
3
2
  const VirtualizerContext = React.createContext(undefined);
4
3
  export const VirtualizerContextProvider = VirtualizerContext.Provider;
5
4
  export const useVirtualizerContext_unstable = ()=>{
@@ -7,11 +6,11 @@ export const useVirtualizerContext_unstable = ()=>{
7
6
  };
8
7
  export const useVirtualizerContextState_unstable = (passedContext)=>{
9
8
  const virtualizerContext = useVirtualizerContext_unstable();
10
- const [_contextIndex, _setContextIndex] = useState(-1);
11
- const childProgressiveSizes = useRef([]);
9
+ const [_contextIndex, _setContextIndex] = React.useState(-1);
10
+ const childProgressiveSizes = React.useRef([]);
12
11
  /* We respect any wrapped providers while also ensuring defaults or passed through
13
12
  * Order of usage -> Passed Prop -> Provider Context -> Internal State default
14
- */ const context = useMemo(()=>{
13
+ */ const context = React.useMemo(()=>{
15
14
  var _passedContext_contextIndex, _ref, _passedContext_setContextIndex, _ref1;
16
15
  return {
17
16
  contextIndex: (_ref = (_passedContext_contextIndex = passedContext === null || passedContext === void 0 ? void 0 : passedContext.contextIndex) !== null && _passedContext_contextIndex !== void 0 ? _passedContext_contextIndex : virtualizerContext === null || virtualizerContext === void 0 ? void 0 : virtualizerContext.contextIndex) !== null && _ref !== void 0 ? _ref : _contextIndex,
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/utilities/VirtualizerContext/VirtualizerContext.ts"],"sourcesContent":["import * as React from 'react';\nimport type { DynamicVirtualizerContextProps, VirtualizerContextProps } from './types';\nimport { useMemo, useState, useRef } from 'react';\n\nconst VirtualizerContext = React.createContext<VirtualizerContextProps | undefined>(\n undefined,\n) as React.Context<VirtualizerContextProps>;\n\nexport const VirtualizerContextProvider = VirtualizerContext.Provider;\n\nexport const useVirtualizerContext_unstable = () => {\n return React.useContext(VirtualizerContext);\n};\n\nexport const useVirtualizerContextState_unstable = (\n passedContext?: VirtualizerContextProps,\n): DynamicVirtualizerContextProps => {\n const virtualizerContext = useVirtualizerContext_unstable();\n const [_contextIndex, _setContextIndex] = useState<number>(-1);\n const childProgressiveSizes = useRef<number[]>([]);\n\n /* We respect any wrapped providers while also ensuring defaults or passed through\n * Order of usage -> Passed Prop -> Provider Context -> Internal State default\n */\n const context = useMemo(\n () => ({\n contextIndex: passedContext?.contextIndex ?? virtualizerContext?.contextIndex ?? _contextIndex,\n setContextIndex: passedContext?.setContextIndex ?? virtualizerContext?.setContextIndex ?? _setContextIndex,\n childProgressiveSizes,\n }),\n [_contextIndex, passedContext, virtualizerContext],\n );\n\n return context;\n};\n"],"names":["React","useMemo","useState","useRef","VirtualizerContext","createContext","undefined","VirtualizerContextProvider","Provider","useVirtualizerContext_unstable","useContext","useVirtualizerContextState_unstable","passedContext","virtualizerContext","_contextIndex","_setContextIndex","childProgressiveSizes","context","contextIndex","setContextIndex"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,OAAO,EAAEC,QAAQ,EAAEC,MAAM,QAAQ,QAAQ;AAElD,MAAMC,qBAAqBJ,MAAMK,aAAa,CAC5CC;AAGF,OAAO,MAAMC,6BAA6BH,mBAAmBI,QAAQ,CAAC;AAEtE,OAAO,MAAMC,iCAAiC;IAC5C,OAAOT,MAAMU,UAAU,CAACN;AAC1B,EAAE;AAEF,OAAO,MAAMO,sCAAsC,CACjDC;IAEA,MAAMC,qBAAqBJ;IAC3B,MAAM,CAACK,eAAeC,iBAAiB,GAAGb,SAAiB,CAAC;IAC5D,MAAMc,wBAAwBb,OAAiB,EAAE;IAEjD;;GAEC,GACD,MAAMc,UAAUhB,QACd;YACgBW,6BAAAA,MACGA,gCAAAA;eAFZ;YACLM,cAAcN,CAAAA,OAAAA,CAAAA,8BAAAA,0BAAAA,oCAAAA,cAAeM,YAAY,cAA3BN,yCAAAA,8BAA+BC,+BAAAA,yCAAAA,mBAAoBK,YAAY,cAA/DN,kBAAAA,OAAmEE;YACjFK,iBAAiBP,CAAAA,QAAAA,CAAAA,iCAAAA,0BAAAA,oCAAAA,cAAeO,eAAe,cAA9BP,4CAAAA,iCAAkCC,+BAAAA,yCAAAA,mBAAoBM,eAAe,cAArEP,mBAAAA,QAAyEG;YAC1FC;QACF;IAAA,GACA;QAACF;QAAeF;QAAeC;KAAmB;IAGpD,OAAOI;AACT,EAAE"}
1
+ {"version":3,"sources":["../src/utilities/VirtualizerContext/VirtualizerContext.ts"],"sourcesContent":["import * as React from 'react';\nimport type { DynamicVirtualizerContextProps, VirtualizerContextProps } from './types';\n\nconst VirtualizerContext = React.createContext<VirtualizerContextProps | undefined>(\n undefined,\n) as React.Context<VirtualizerContextProps>;\n\nexport const VirtualizerContextProvider = VirtualizerContext.Provider;\n\nexport const useVirtualizerContext_unstable = () => {\n return React.useContext(VirtualizerContext);\n};\n\nexport const useVirtualizerContextState_unstable = (\n passedContext?: VirtualizerContextProps,\n): DynamicVirtualizerContextProps => {\n const virtualizerContext = useVirtualizerContext_unstable();\n const [_contextIndex, _setContextIndex] = React.useState<number>(-1);\n const childProgressiveSizes = React.useRef<number[]>([]);\n\n /* We respect any wrapped providers while also ensuring defaults or passed through\n * Order of usage -> Passed Prop -> Provider Context -> Internal State default\n */\n const context = React.useMemo(\n () => ({\n contextIndex: passedContext?.contextIndex ?? virtualizerContext?.contextIndex ?? _contextIndex,\n setContextIndex: passedContext?.setContextIndex ?? virtualizerContext?.setContextIndex ?? _setContextIndex,\n childProgressiveSizes,\n }),\n [_contextIndex, passedContext, virtualizerContext],\n );\n\n return context;\n};\n"],"names":["React","VirtualizerContext","createContext","undefined","VirtualizerContextProvider","Provider","useVirtualizerContext_unstable","useContext","useVirtualizerContextState_unstable","passedContext","virtualizerContext","_contextIndex","_setContextIndex","useState","childProgressiveSizes","useRef","context","useMemo","contextIndex","setContextIndex"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAG/B,MAAMC,qBAAqBD,MAAME,aAAa,CAC5CC;AAGF,OAAO,MAAMC,6BAA6BH,mBAAmBI,QAAQ,CAAC;AAEtE,OAAO,MAAMC,iCAAiC;IAC5C,OAAON,MAAMO,UAAU,CAACN;AAC1B,EAAE;AAEF,OAAO,MAAMO,sCAAsC,CACjDC;IAEA,MAAMC,qBAAqBJ;IAC3B,MAAM,CAACK,eAAeC,iBAAiB,GAAGZ,MAAMa,QAAQ,CAAS,CAAC;IAClE,MAAMC,wBAAwBd,MAAMe,MAAM,CAAW,EAAE;IAEvD;;GAEC,GACD,MAAMC,UAAUhB,MAAMiB,OAAO,CAC3B;YACgBR,6BAAAA,MACGA,gCAAAA;eAFZ;YACLS,cAAcT,CAAAA,OAAAA,CAAAA,8BAAAA,0BAAAA,oCAAAA,cAAeS,YAAY,cAA3BT,yCAAAA,8BAA+BC,+BAAAA,yCAAAA,mBAAoBQ,YAAY,cAA/DT,kBAAAA,OAAmEE;YACjFQ,iBAAiBV,CAAAA,QAAAA,CAAAA,iCAAAA,0BAAAA,oCAAAA,cAAeU,eAAe,cAA9BV,4CAAAA,iCAAkCC,+BAAAA,yCAAAA,mBAAoBS,eAAe,cAArEV,mBAAAA,QAAyEG;YAC1FE;QACF;IAAA,GACA;QAACH;QAAeF;QAAeC;KAAmB;IAGpD,OAAOM;AACT,EAAE"}
@@ -8,6 +8,8 @@ Object.defineProperty(exports, "Virtualizer", {
8
8
  return Virtualizer;
9
9
  }
10
10
  });
11
+ const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
12
+ const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
11
13
  const _useVirtualizerStylesstyles = require("./useVirtualizerStyles.styles");
12
14
  const _useVirtualizer = require("./useVirtualizer");
13
15
  const _renderVirtualizer = require("./renderVirtualizer");
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Virtualizer/Virtualizer.ts"],"sourcesContent":["import type { VirtualizerProps } from './Virtualizer.types';\nimport { useVirtualizerStyles_unstable } from './useVirtualizerStyles.styles';\nimport { useVirtualizer_unstable } from './useVirtualizer';\nimport { renderVirtualizer_unstable } from './renderVirtualizer';\nimport type { FC } from 'react';\n\n/**\n * Virtualizer pseudo-component, this functional wrapper\n * provides a simple interface for reducing the total number\n * of elements rendered at one time in large lists.\n */\nexport const Virtualizer: FC<VirtualizerProps> = (props: VirtualizerProps) => {\n const state = useVirtualizer_unstable(props);\n useVirtualizerStyles_unstable(state);\n\n return renderVirtualizer_unstable(state);\n};\n\nVirtualizer.displayName = 'Virtualizer';\n"],"names":["Virtualizer","props","state","useVirtualizer_unstable","useVirtualizerStyles_unstable","renderVirtualizer_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;","mappings":";;;;+BAWaA;;;eAAAA;;;4CAViC;gCACN;mCACG;AAQpC,MAAMA,cAAoC,CAACC;IAChD,MAAMC,QAAQC,IAAAA,uCAAAA,EAAwBF;IACtCG,IAAAA,yDAAAA,EAA8BF;IAE9B,OAAOG,IAAAA,6CAAAA,EAA2BH;AACpC;AAEAF,YAAYM,WAAW,GAAG"}
1
+ {"version":3,"sources":["../src/components/Virtualizer/Virtualizer.ts"],"sourcesContent":["import * as React from 'react';\nimport type { VirtualizerProps } from './Virtualizer.types';\nimport { useVirtualizerStyles_unstable } from './useVirtualizerStyles.styles';\nimport { useVirtualizer_unstable } from './useVirtualizer';\nimport { renderVirtualizer_unstable } from './renderVirtualizer';\n\n/**\n * Virtualizer pseudo-component, this functional wrapper\n * provides a simple interface for reducing the total number\n * of elements rendered at one time in large lists.\n */\nexport const Virtualizer: React.FC<VirtualizerProps> = (props: VirtualizerProps) => {\n const state = useVirtualizer_unstable(props);\n useVirtualizerStyles_unstable(state);\n\n return renderVirtualizer_unstable(state);\n};\n\nVirtualizer.displayName = 'Virtualizer';\n"],"names":["Virtualizer","props","state","useVirtualizer_unstable","useVirtualizerStyles_unstable","renderVirtualizer_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAWaA;;;eAAAA;;;;iEAXU;4CAEuB;gCACN;mCACG;AAOpC,MAAMA,cAA0C,CAACC;IACtD,MAAMC,QAAQC,IAAAA,uCAAAA,EAAwBF;IACtCG,IAAAA,yDAAAA,EAA8BF;IAE9B,OAAOG,IAAAA,6CAAAA,EAA2BH;AACpC;AAEAF,YAAYM,WAAW,GAAG"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Virtualizer/Virtualizer.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { VirtualizerContextProps } from '../../Utilities';\nimport type { RefObject, MutableRefObject } from 'react';\n\nexport type VirtualizerSlots = {\n /**\n * The intersection observed 'before' element will detect when scrolling towards the beginning.\n */\n before: NonNullable<Slot<'div', 'td'>>;\n /**\n * A block place holding whitespace at the beginning of current DOM children.\n */\n beforeContainer: NonNullable<Slot<'div', 'tr'>>;\n /**\n * The intersection observed 'after' element will detect when scrolling towards the end.\n */\n after: NonNullable<Slot<'div', 'td'>>;\n /**\n * A block place holding whitespace after the end of current DOM children.\n */\n afterContainer: NonNullable<Slot<'div', 'tr'>>;\n};\n\nexport type VirtualizerConfigState = {\n /**\n * The current virtualized array of children to show in the DOM.\n */\n virtualizedChildren: React.ReactNode[];\n /**\n * The current start index for the virtualizer, all previous index's will be removed from DOM.\n */\n virtualizerStartIndex: number;\n /**\n * Current buffer height required at beginning of array.\n */\n afterBufferHeight: number;\n /**\n * Current buffer height required at end of array.\n */\n beforeBufferHeight: number;\n /**\n * The total current height of the scrollView/child content.\n */\n totalVirtualizerHeight: number;\n /**\n * The scroll direction\n * @default vertical\n */\n axis?: 'vertical' | 'horizontal';\n /**\n * Tells the virtualizer to measure in the reverse direction (for column-reverse order etc.)\n */\n reversed?: boolean;\n /**\n * Enables the isScrolling property in the child render function\n * Default: false - to prevent nessecary render function calls\n */\n enableScrollLoad?: boolean;\n /**\n * Pixel size of intersection observers and how much they 'cross over' into the bufferItems index.\n * Minimum 1px.\n */\n bufferSize: number;\n /**\n * Ref for access to internal size knowledge, can be used to measure updates\n */\n childSizes: React.MutableRefObject<number[]>;\n /**\n * Ref for access to internal progressive size knowledge, can be used to measure updates\n */\n childProgressiveSizes: React.MutableRefObject<number[]>;\n};\n\nexport type VirtualizerState = ComponentState<VirtualizerSlots> & VirtualizerConfigState;\n\n/**\n * The main child render method of Virtualization\n * isScrolling will only be enabled when enableScrollLoad is set to true.\n */\nexport type VirtualizerChildRenderFunction = (index: number, isScrolling: boolean) => React.ReactNode;\n\nexport type VirtualizerDataRef = {\n progressiveSizes: RefObject<number[]>;\n nodeSizes: RefObject<number[]>;\n setFlaggedIndex: (index: number | null) => void;\n currentIndex: RefObject<number>;\n};\n\nexport type VirtualizerConfigProps = {\n /**\n * Child render function.\n * Iteratively called to return current virtualizer DOM children.\n * Will act as a row or column indexer depending on Virtualizer settings.\n * Can be used dynamically.\n */\n children: VirtualizerChildRenderFunction;\n\n /**\n * Default cell size to use if no custom callback provided.\n * If implementing `getItemSize` this should be the initial and ideally minimum cell size.\n */\n itemSize: number;\n\n /**\n * The total number of items to be virtualized.\n */\n numItems: number;\n\n /**\n * Number of children to render in the DOM during virtualization.\n * Constraints:\n * - Large enough that the items rendered in DOM cover the viewport\n * and intersection observer buffers (buffersize) at both ends.\n */\n virtualizerLength: number;\n\n /**\n * Defaults to 1/4th (or 1/3rd for dynamic items) of virtualizerLength.\n * RECOMMEND: Override this with a consistent value if using a dynamic virtualizer.\n *\n * Controls the number of elements rendered before the current index entering the virtualized viewport.\n * Constraints:\n * - Large enough to cover bufferSize (prevents buffers intersecting into the viewport during rest state).\n * - Small enough that the virtualizer only renders a few items outside of view.\n */\n bufferItems?: number;\n\n /**\n * Defaults to half of bufferItems * itemSize size (in pixels).\n * RECOMMEND: Override this with a consistent minimum item size value if using a dynamic virtualizer.\n * The length (in pixels) before the end/start DOM index where the virtualizer recalculation will be triggered.\n * Increasing this reduces whitespace on ultra-fast scroll, as additional elements\n * are buffered to appear while virtualization recalculates.\n * Constraints:\n * - At least 1px - although this will only trigger the recalculation after bookends (whitespace) enter viewport.\n * - BufferSize must be smaller than bufferItems pixel size, as it prevents bookends entering viewport at rest.\n */\n bufferSize?: number;\n\n /**\n * Enables users to override the intersectionObserverRoot.\n * We recommend passing this in for accurate distance assessment in IO\n */\n scrollViewRef?: React.MutableRefObject<HTMLElement | null>;\n\n /**\n * The scroll direction\n * @default vertical\n */\n axis?: 'vertical' | 'horizontal';\n\n /**\n * Tells the virtualizer to measure in the reverse direction (for column-reverse order etc.)\n * This value should be flipped in RTL implementation (TBD whether automate RTL).\n */\n reversed?: boolean;\n\n /**\n * Enables the isScrolling property in the child render function\n * Default: false - to prevent nessecary render function calls\n */\n enableScrollLoad?: boolean;\n\n /**\n * Callback for acquiring size of individual items\n * @param index - the index of the requested size's child\n */\n getItemSize?: (index: number) => number;\n\n /**\n * Virtualizer context can be passed as a prop for extended class use\n */\n virtualizerContext?: VirtualizerContextProps;\n\n /**\n * Callback for notifying when a flagged index has been rendered\n */\n // eslint-disable-next-line @nx/workspace-consistent-callback-type -- can't change type of existing callback\n onRenderedFlaggedIndex?: (index: number) => void;\n\n /*\n * Callback for notifying when a flagged index has been rendered\n */\n flaggedIndex?: MutableRefObject<number | null>;\n\n /**\n * Imperative ref contains our scrollTo index functionality for user control.\n */\n imperativeVirtualizerRef?: RefObject<VirtualizerDataRef>;\n\n /**\n * A ref that provides the size of container (vertical - height, horizontal - width), set by a resize observer.\n * Virtualizer Measure hooks provide a suitable reference.\n */\n containerSizeRef: RefObject<number>;\n\n /**\n * A callback that enables updating scroll position for calculating required dynamic lengths,\n * this should be passed in from useDynamicVirtualizerMeasure\n */\n updateScrollPosition?: (position: number) => void;\n};\n\nexport type VirtualizerProps = ComponentProps<Partial<VirtualizerSlots>> & VirtualizerConfigProps;\n"],"names":[],"rangeMappings":";;;;;","mappings":";;;;;iEAAuB"}
1
+ {"version":3,"sources":["../src/components/Virtualizer/Virtualizer.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { VirtualizerContextProps } from '../../Utilities';\n\nexport type VirtualizerSlots = {\n /**\n * The intersection observed 'before' element will detect when scrolling towards the beginning.\n */\n before: NonNullable<Slot<'div', 'td'>>;\n /**\n * A block place holding whitespace at the beginning of current DOM children.\n */\n beforeContainer: NonNullable<Slot<'div', 'tr'>>;\n /**\n * The intersection observed 'after' element will detect when scrolling towards the end.\n */\n after: NonNullable<Slot<'div', 'td'>>;\n /**\n * A block place holding whitespace after the end of current DOM children.\n */\n afterContainer: NonNullable<Slot<'div', 'tr'>>;\n};\n\nexport type VirtualizerConfigState = {\n /**\n * The current virtualized array of children to show in the DOM.\n */\n virtualizedChildren: React.ReactNode[];\n /**\n * The current start index for the virtualizer, all previous index's will be removed from DOM.\n */\n virtualizerStartIndex: number;\n /**\n * Current buffer height required at beginning of array.\n */\n afterBufferHeight: number;\n /**\n * Current buffer height required at end of array.\n */\n beforeBufferHeight: number;\n /**\n * The total current height of the scrollView/child content.\n */\n totalVirtualizerHeight: number;\n /**\n * The scroll direction\n * @default vertical\n */\n axis?: 'vertical' | 'horizontal';\n /**\n * Tells the virtualizer to measure in the reverse direction (for column-reverse order etc.)\n */\n reversed?: boolean;\n /**\n * Enables the isScrolling property in the child render function\n * Default: false - to prevent nessecary render function calls\n */\n enableScrollLoad?: boolean;\n /**\n * Pixel size of intersection observers and how much they 'cross over' into the bufferItems index.\n * Minimum 1px.\n */\n bufferSize: number;\n /**\n * Ref for access to internal size knowledge, can be used to measure updates\n */\n childSizes: React.MutableRefObject<number[]>;\n /**\n * Ref for access to internal progressive size knowledge, can be used to measure updates\n */\n childProgressiveSizes: React.MutableRefObject<number[]>;\n};\n\nexport type VirtualizerState = ComponentState<VirtualizerSlots> & VirtualizerConfigState;\n\n/**\n * The main child render method of Virtualization\n * isScrolling will only be enabled when enableScrollLoad is set to true.\n */\nexport type VirtualizerChildRenderFunction = (index: number, isScrolling: boolean) => React.ReactNode;\n\nexport type VirtualizerDataRef = {\n progressiveSizes: React.RefObject<number[]>;\n nodeSizes: React.RefObject<number[]>;\n setFlaggedIndex: (index: number | null) => void;\n currentIndex: React.RefObject<number>;\n};\n\nexport type VirtualizerConfigProps = {\n /**\n * Child render function.\n * Iteratively called to return current virtualizer DOM children.\n * Will act as a row or column indexer depending on Virtualizer settings.\n * Can be used dynamically.\n */\n children: VirtualizerChildRenderFunction;\n\n /**\n * Default cell size to use if no custom callback provided.\n * If implementing `getItemSize` this should be the initial and ideally minimum cell size.\n */\n itemSize: number;\n\n /**\n * The total number of items to be virtualized.\n */\n numItems: number;\n\n /**\n * Number of children to render in the DOM during virtualization.\n * Constraints:\n * - Large enough that the items rendered in DOM cover the viewport\n * and intersection observer buffers (buffersize) at both ends.\n */\n virtualizerLength: number;\n\n /**\n * Defaults to 1/4th (or 1/3rd for dynamic items) of virtualizerLength.\n * RECOMMEND: Override this with a consistent value if using a dynamic virtualizer.\n *\n * Controls the number of elements rendered before the current index entering the virtualized viewport.\n * Constraints:\n * - Large enough to cover bufferSize (prevents buffers intersecting into the viewport during rest state).\n * - Small enough that the virtualizer only renders a few items outside of view.\n */\n bufferItems?: number;\n\n /**\n * Defaults to half of bufferItems * itemSize size (in pixels).\n * RECOMMEND: Override this with a consistent minimum item size value if using a dynamic virtualizer.\n * The length (in pixels) before the end/start DOM index where the virtualizer recalculation will be triggered.\n * Increasing this reduces whitespace on ultra-fast scroll, as additional elements\n * are buffered to appear while virtualization recalculates.\n * Constraints:\n * - At least 1px - although this will only trigger the recalculation after bookends (whitespace) enter viewport.\n * - BufferSize must be smaller than bufferItems pixel size, as it prevents bookends entering viewport at rest.\n */\n bufferSize?: number;\n\n /**\n * Enables users to override the intersectionObserverRoot.\n * We recommend passing this in for accurate distance assessment in IO\n */\n scrollViewRef?: React.MutableRefObject<HTMLElement | null>;\n\n /**\n * The scroll direction\n * @default vertical\n */\n axis?: 'vertical' | 'horizontal';\n\n /**\n * Tells the virtualizer to measure in the reverse direction (for column-reverse order etc.)\n * This value should be flipped in RTL implementation (TBD whether automate RTL).\n */\n reversed?: boolean;\n\n /**\n * Enables the isScrolling property in the child render function\n * Default: false - to prevent nessecary render function calls\n */\n enableScrollLoad?: boolean;\n\n /**\n * Callback for acquiring size of individual items\n * @param index - the index of the requested size's child\n */\n getItemSize?: (index: number) => number;\n\n /**\n * Virtualizer context can be passed as a prop for extended class use\n */\n virtualizerContext?: VirtualizerContextProps;\n\n /**\n * Callback for notifying when a flagged index has been rendered\n */\n // eslint-disable-next-line @nx/workspace-consistent-callback-type -- can't change type of existing callback\n onRenderedFlaggedIndex?: (index: number) => void;\n\n /*\n * Callback for notifying when a flagged index has been rendered\n */\n flaggedIndex?: React.MutableRefObject<number | null>;\n\n /**\n * Imperative ref contains our scrollTo index functionality for user control.\n */\n imperativeVirtualizerRef?: React.RefObject<VirtualizerDataRef>;\n\n /**\n * A ref that provides the size of container (vertical - height, horizontal - width), set by a resize observer.\n * Virtualizer Measure hooks provide a suitable reference.\n */\n containerSizeRef: React.RefObject<number>;\n\n /**\n * A callback that enables updating scroll position for calculating required dynamic lengths,\n * this should be passed in from useDynamicVirtualizerMeasure\n */\n updateScrollPosition?: (position: number) => void;\n\n /**\n * Spacing between rendered children for calculation, should match the container's gap CSS value.\n */\n gap?: number;\n};\n\nexport type VirtualizerProps = ComponentProps<Partial<VirtualizerSlots>> & VirtualizerConfigProps;\n"],"names":[],"rangeMappings":";;;;;","mappings":";;;;;iEAAuB"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Virtualizer/renderVirtualizer.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport * as React from 'react';\nimport type { VirtualizerSlots, VirtualizerState } from './Virtualizer.types';\nimport type { ReactNode } from 'react';\n\nimport { assertSlots } from '@fluentui/react-utilities';\n\nexport const renderVirtualizer_unstable = (state: VirtualizerState) => {\n assertSlots<VirtualizerSlots>(state);\n return (\n <React.Fragment>\n {/* The 'before' bookend to hold items in place and detect scroll previous */}\n <state.beforeContainer>\n <state.before />\n </state.beforeContainer>\n {/* The reduced list of non-virtualized children to be rendered */}\n {state.virtualizedChildren}\n {/* The 'after' bookend to hold items in place and detect scroll next */}\n <state.afterContainer>\n <state.after />\n </state.afterContainer>\n </React.Fragment>\n );\n};\n\nexport const renderVirtualizerChildPlaceholder = (child: ReactNode, index: number) => {\n return (\n <React.Suspense key={`fui-virtualizer-placeholder-${index}`} fallback={null}>\n {child}\n </React.Suspense>\n );\n};\n"],"names":["renderVirtualizerChildPlaceholder","renderVirtualizer_unstable","state","assertSlots","_jsxs","React","Fragment","_jsx","beforeContainer","before","virtualizedChildren","afterContainer","after","child","index","Suspense","fallback"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IA2BaA,iCAAAA;eAAAA;;IAlBAC,0BAAAA;eAAAA;;;;4BARb;iEAEuB;gCAIK;AAErB,MAAMA,6BAA6B,CAACC;IACzCC,IAAAA,2BAAAA,EAA8BD;IAC9B,OAAA,WAAA,GACEE,IAAAA,gBAAA,EAACC,OAAMC,QAAQ,EAAA;;0BAEbC,IAAAA,eAAA,EAACL,MAAMM,eAAe,EAAA;0BACpB,WAAA,GAAAD,IAAAA,eAAA,EAACL,MAAMO,MAAM,EAAA,CAAA;;YAGdP,MAAMQ,mBAAmB;0BAE1BH,IAAAA,eAAA,EAACL,MAAMS,cAAc,EAAA;0BACnB,WAAA,GAAAJ,IAAAA,eAAA,EAACL,MAAMU,KAAK,EAAA,CAAA;;;;AAIpB;AAEO,MAAMZ,oCAAoC,CAACa,OAAkBC;IAClE,OAAA,WAAA,GACEP,IAAAA,eAAA,EAACF,OAAMU,QAAQ,EAAA;QAA8CC,UAAU;kBACpEH;OADkB,CAAC,4BAA4B,EAAEC,MAAM,CAAC;AAI/D"}
1
+ {"version":3,"sources":["../src/components/Virtualizer/renderVirtualizer.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport * as React from 'react';\nimport type { VirtualizerSlots, VirtualizerState } from './Virtualizer.types';\n\nimport { assertSlots } from '@fluentui/react-utilities';\n\nexport const renderVirtualizer_unstable = (state: VirtualizerState) => {\n assertSlots<VirtualizerSlots>(state);\n return (\n <React.Fragment>\n {/* The 'before' bookend to hold items in place and detect scroll previous */}\n <state.beforeContainer>\n <state.before />\n </state.beforeContainer>\n {/* The reduced list of non-virtualized children to be rendered */}\n {state.virtualizedChildren}\n {/* The 'after' bookend to hold items in place and detect scroll next */}\n <state.afterContainer>\n <state.after />\n </state.afterContainer>\n </React.Fragment>\n );\n};\n\nexport const renderVirtualizerChildPlaceholder = (child: React.ReactNode, index: number) => {\n return (\n <React.Suspense key={`fui-virtualizer-placeholder-${index}`} fallback={null}>\n {child}\n </React.Suspense>\n );\n};\n"],"names":["renderVirtualizerChildPlaceholder","renderVirtualizer_unstable","state","assertSlots","_jsxs","React","Fragment","_jsx","beforeContainer","before","virtualizedChildren","afterContainer","after","child","index","Suspense","fallback"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IA0BaA,iCAAAA;eAAAA;;IAlBAC,0BAAAA;eAAAA;;;;4BAPb;iEAEuB;gCAGK;AAErB,MAAMA,6BAA6B,CAACC;IACzCC,IAAAA,2BAAAA,EAA8BD;IAC9B,OAAA,WAAA,GACEE,IAAAA,gBAAA,EAACC,OAAMC,QAAQ,EAAA;;0BAEbC,IAAAA,eAAA,EAACL,MAAMM,eAAe,EAAA;0BACpB,WAAA,GAAAD,IAAAA,eAAA,EAACL,MAAMO,MAAM,EAAA,CAAA;;YAGdP,MAAMQ,mBAAmB;0BAE1BH,IAAAA,eAAA,EAACL,MAAMS,cAAc,EAAA;0BACnB,WAAA,GAAAJ,IAAAA,eAAA,EAACL,MAAMU,KAAK,EAAA,CAAA;;;;AAIpB;AAEO,MAAMZ,oCAAoC,CAACa,OAAwBC;IACxE,OAAA,WAAA,GACEP,IAAAA,eAAA,EAACF,OAAMU,QAAQ,EAAA;QAA8CC,UAAU;kBACpEH;OADkB,CAAC,4BAA4B,EAAEC,MAAM,CAAC;AAI/D"}
@@ -8,42 +8,43 @@ Object.defineProperty(exports, "useVirtualizer_unstable", {
8
8
  return useVirtualizer_unstable;
9
9
  }
10
10
  });
11
- const _react = require("react");
11
+ const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
12
+ const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
12
13
  const _useIntersectionObserver = require("../../hooks/useIntersectionObserver");
13
14
  const _Utilities = require("../../Utilities");
14
15
  const _reactutilities = require("@fluentui/react-utilities");
15
16
  const _reactdom = require("react-dom");
16
17
  function useVirtualizer_unstable(props) {
17
18
  'use no memo';
18
- const { itemSize, numItems, virtualizerLength, children: renderChild, getItemSize, bufferItems = Math.round(virtualizerLength / 4.0), bufferSize = Math.floor(bufferItems / 2.0) * itemSize, axis = 'vertical', reversed = false, virtualizerContext, onRenderedFlaggedIndex, imperativeVirtualizerRef, containerSizeRef, scrollViewRef, enableScrollLoad, updateScrollPosition } = props;
19
+ const { itemSize, numItems, virtualizerLength, children: renderChild, getItemSize, bufferItems = Math.round(virtualizerLength / 4.0), bufferSize = Math.floor(bufferItems / 2.0) * itemSize, axis = 'vertical', reversed = false, virtualizerContext, onRenderedFlaggedIndex, imperativeVirtualizerRef, containerSizeRef, scrollViewRef, enableScrollLoad, updateScrollPosition, gap = 0 } = props;
19
20
  /* The context is optional, it's useful for injecting additional index logic, or performing uniform state updates*/ const _virtualizerContext = (0, _Utilities.useVirtualizerContextState_unstable)(virtualizerContext);
20
21
  // We use this ref as a constant source to access the virtualizer's state imperatively
21
- const actualIndexRef = (0, _react.useRef)(_virtualizerContext.contextIndex);
22
- const flaggedIndex = (0, _react.useRef)(null);
22
+ const actualIndexRef = _react.useRef(_virtualizerContext.contextIndex);
23
+ const flaggedIndex = _react.useRef(null);
23
24
  const actualIndex = _virtualizerContext.contextIndex;
24
25
  // Just in case our ref gets out of date vs the context during a re-render
25
26
  if (_virtualizerContext.contextIndex !== actualIndexRef.current) {
26
27
  actualIndexRef.current = _virtualizerContext.contextIndex;
27
28
  }
28
- const setActualIndex = (0, _react.useCallback)((index)=>{
29
+ const setActualIndex = _react.useCallback((index)=>{
29
30
  actualIndexRef.current = index;
30
31
  _virtualizerContext.setContextIndex(index);
31
32
  }, [
32
33
  _virtualizerContext
33
34
  ]);
34
35
  // Store ref to before padding element
35
- const beforeElementRef = (0, _react.useRef)(null);
36
+ const beforeElementRef = _react.useRef(null);
36
37
  // Store ref to before padding element
37
- const afterElementRef = (0, _react.useRef)(null);
38
+ const afterElementRef = _react.useRef(null);
38
39
  // We need to store an array to track dynamic sizes, we can use this to incrementally update changes
39
- const childSizes = (0, _react.useRef)(new Array(getItemSize ? numItems : 0));
40
+ const childSizes = _react.useRef(new Array(getItemSize ? numItems : 0));
40
41
  /* We keep track of the progressive sizing/placement down the list,
41
- this helps us skip re-calculations unless children/size changes */ const childProgressiveSizes = (0, _react.useRef)(new Array(getItemSize ? numItems : 0));
42
+ this helps us skip re-calculations unless children/size changes */ const childProgressiveSizes = _react.useRef(new Array(getItemSize ? numItems : 0));
42
43
  if (virtualizerContext === null || virtualizerContext === void 0 ? void 0 : virtualizerContext.childProgressiveSizes) {
43
44
  virtualizerContext.childProgressiveSizes.current = childProgressiveSizes.current;
44
45
  }
45
46
  // The internal tracking REF for child array (updates often).
46
- const childArray = (0, _react.useRef)(new Array(virtualizerLength));
47
+ const childArray = _react.useRef(new Array(virtualizerLength));
47
48
  const populateSizeArrays = ()=>{
48
49
  if (!getItemSize) {
49
50
  // Static sizes, never mind!
@@ -59,7 +60,8 @@ function useVirtualizer_unstable(props) {
59
60
  }
60
61
  }
61
62
  for(let index = 0; index < numItems; index++){
62
- childSizes.current[index] = getItemSize(index);
63
+ const _gap = index < numItems - 1 ? gap : 0;
64
+ childSizes.current[index] = getItemSize(index) + _gap;
63
65
  if (index === 0) {
64
66
  childProgressiveSizes.current[index] = childSizes.current[index];
65
67
  } else {
@@ -67,10 +69,10 @@ function useVirtualizer_unstable(props) {
67
69
  }
68
70
  }
69
71
  };
70
- const [isScrolling, setIsScrolling] = (0, _react.useState)(false);
72
+ const [isScrolling, setIsScrolling] = _react.useState(false);
71
73
  const [setScrollTimer, clearScrollTimer] = (0, _reactutilities.useTimeout)();
72
- const scrollCounter = (0, _react.useRef)(0);
73
- const initializeScrollingTimer = (0, _react.useCallback)(()=>{
74
+ const scrollCounter = _react.useRef(0);
75
+ const initializeScrollingTimer = _react.useCallback(()=>{
74
76
  if (!enableScrollLoad) {
75
77
  // Disabled by default for reduction of render callbacks
76
78
  return;
@@ -96,13 +98,13 @@ function useVirtualizer_unstable(props) {
96
98
  setScrollTimer,
97
99
  enableScrollLoad
98
100
  ]);
99
- (0, _react.useEffect)(()=>{
101
+ _react.useEffect(()=>{
100
102
  initializeScrollingTimer();
101
103
  }, [
102
104
  actualIndex,
103
105
  initializeScrollingTimer
104
106
  ]);
105
- const updateChildRows = (0, _react.useCallback)((newIndex)=>{
107
+ const updateChildRows = _react.useCallback((newIndex)=>{
106
108
  if (numItems === 0) {
107
109
  /* Nothing to virtualize */ return;
108
110
  }
@@ -121,7 +123,7 @@ function useVirtualizer_unstable(props) {
121
123
  renderChild,
122
124
  virtualizerLength
123
125
  ]);
124
- const updateCurrentItemSizes = (0, _react.useCallback)((newIndex)=>{
126
+ const updateCurrentItemSizes = _react.useCallback((newIndex)=>{
125
127
  if (!getItemSize) {
126
128
  // Static sizes, not required.
127
129
  return;
@@ -132,7 +134,8 @@ function useVirtualizer_unstable(props) {
132
134
  const startIndex = Math.max(newIndex, 0);
133
135
  let didUpdate = false;
134
136
  for(let i = startIndex; i < endIndex; i++){
135
- const newSize = getItemSize(i);
137
+ const _gap = i < numItems - 1 ? gap : 0;
138
+ const newSize = getItemSize(i) + _gap;
136
139
  if (newSize !== childSizes.current[i]) {
137
140
  childSizes.current[i] = newSize;
138
141
  didUpdate = true;
@@ -148,9 +151,10 @@ function useVirtualizer_unstable(props) {
148
151
  }, [
149
152
  getItemSize,
150
153
  numItems,
151
- virtualizerLength
154
+ virtualizerLength,
155
+ gap
152
156
  ]);
153
- const batchUpdateNewIndex = (0, _react.useCallback)((index)=>{
157
+ const batchUpdateNewIndex = _react.useCallback((index)=>{
154
158
  // Local updates
155
159
  updateChildRows(index);
156
160
  updateCurrentItemSizes(index);
@@ -161,7 +165,7 @@ function useVirtualizer_unstable(props) {
161
165
  updateChildRows,
162
166
  updateCurrentItemSizes
163
167
  ]);
164
- const findIndexRecursive = (0, _react.useCallback)((scrollPos, lowIndex, highIndex)=>{
168
+ const findIndexRecursive = _react.useCallback((scrollPos, lowIndex, highIndex)=>{
165
169
  if (lowIndex > highIndex) {
166
170
  // We shouldn't get here - but no-op the index if we do.
167
171
  return actualIndex;
@@ -184,7 +188,7 @@ function useVirtualizer_unstable(props) {
184
188
  }, [
185
189
  actualIndex
186
190
  ]);
187
- const getIndexFromSizeArray = (0, _react.useCallback)((scrollPos)=>{
191
+ const getIndexFromSizeArray = _react.useCallback((scrollPos)=>{
188
192
  /* Quick searches our progressive height array */ if (scrollPos === 0 || childProgressiveSizes.current.length === 0 || scrollPos <= childProgressiveSizes.current[0]) {
189
193
  // Check start
190
194
  return 0;
@@ -197,32 +201,34 @@ function useVirtualizer_unstable(props) {
197
201
  }, [
198
202
  findIndexRecursive
199
203
  ]);
200
- const getIndexFromScrollPosition = (0, _react.useCallback)((scrollPos)=>{
204
+ const getIndexFromScrollPosition = _react.useCallback((scrollPos)=>{
201
205
  if (!getItemSize) {
202
- return Math.round(scrollPos / itemSize);
206
+ return Math.round(scrollPos / (itemSize + gap));
203
207
  }
204
208
  return getIndexFromSizeArray(scrollPos);
205
209
  }, [
206
210
  getIndexFromSizeArray,
207
211
  getItemSize,
208
- itemSize
212
+ itemSize,
213
+ gap
209
214
  ]);
210
- const calculateTotalSize = (0, _react.useCallback)(()=>{
215
+ const calculateTotalSize = _react.useCallback(()=>{
211
216
  if (!getItemSize) {
212
- return itemSize * numItems;
217
+ return (itemSize + gap) * numItems;
213
218
  }
214
219
  // Time for custom size calcs
215
220
  return childProgressiveSizes.current[numItems - 1];
216
221
  }, [
217
222
  getItemSize,
218
223
  itemSize,
219
- numItems
224
+ numItems,
225
+ gap
220
226
  ]);
221
- const calculateBefore = (0, _react.useCallback)(()=>{
227
+ const calculateBefore = _react.useCallback(()=>{
222
228
  const currentIndex = Math.min(actualIndex, numItems - 1);
223
229
  if (!getItemSize) {
224
230
  // The missing items from before virtualization starts height
225
- return currentIndex * itemSize;
231
+ return currentIndex * (itemSize + gap);
226
232
  }
227
233
  if (currentIndex <= 0) {
228
234
  return 0;
@@ -233,9 +239,10 @@ function useVirtualizer_unstable(props) {
233
239
  actualIndex,
234
240
  getItemSize,
235
241
  itemSize,
236
- numItems
242
+ numItems,
243
+ gap
237
244
  ]);
238
- const calculateAfter = (0, _react.useCallback)(()=>{
245
+ const calculateAfter = _react.useCallback(()=>{
239
246
  if (numItems === 0 || actualIndex + virtualizerLength >= numItems) {
240
247
  return 0;
241
248
  }
@@ -243,7 +250,7 @@ function useVirtualizer_unstable(props) {
243
250
  if (!getItemSize) {
244
251
  // The missing items from after virtualization ends height
245
252
  const remainingItems = numItems - lastItemIndex;
246
- return remainingItems * itemSize;
253
+ return remainingItems * (itemSize + gap) - gap;
247
254
  }
248
255
  // Time for custom size calcs
249
256
  return childProgressiveSizes.current[numItems - 1] - childProgressiveSizes.current[lastItemIndex - 1];
@@ -252,10 +259,11 @@ function useVirtualizer_unstable(props) {
252
259
  getItemSize,
253
260
  itemSize,
254
261
  numItems,
255
- virtualizerLength
262
+ virtualizerLength,
263
+ gap
256
264
  ]);
257
265
  // Observe intersections of virtualized components
258
- const { setObserverList } = (0, _useIntersectionObserver.useIntersectionObserver)((0, _react.useCallback)(// eslint-disable-next-line no-restricted-globals
266
+ const { setObserverList } = (0, _useIntersectionObserver.useIntersectionObserver)(_react.useCallback(// eslint-disable-next-line no-restricted-globals
259
267
  (entries, observer)=>{
260
268
  /* Sanity check - do we even need virtualization? */ if (virtualizerLength > numItems) {
261
269
  if (actualIndex !== 0) {
@@ -374,7 +382,7 @@ function useVirtualizer_unstable(props) {
374
382
  rootMargin: '0px',
375
383
  threshold: 0
376
384
  });
377
- const setBeforeRef = (0, _react.useCallback)((element)=>{
385
+ const setBeforeRef = _react.useCallback((element)=>{
378
386
  if (!element || beforeElementRef.current === element) {
379
387
  return;
380
388
  }
@@ -389,7 +397,7 @@ function useVirtualizer_unstable(props) {
389
397
  }, [
390
398
  setObserverList
391
399
  ]);
392
- const setAfterRef = (0, _react.useCallback)((element)=>{
400
+ const setAfterRef = _react.useCallback((element)=>{
393
401
  if (!element || afterElementRef.current === element) {
394
402
  return;
395
403
  }
@@ -405,14 +413,14 @@ function useVirtualizer_unstable(props) {
405
413
  setObserverList
406
414
  ]);
407
415
  // Initialize the size array before first render.
408
- const hasInitialized = (0, _react.useRef)(false);
416
+ const hasInitialized = _react.useRef(false);
409
417
  const initializeSizeArray = ()=>{
410
418
  if (hasInitialized.current === false) {
411
419
  hasInitialized.current = true;
412
420
  populateSizeArrays();
413
421
  }
414
422
  };
415
- (0, _react.useImperativeHandle)(imperativeVirtualizerRef, ()=>{
423
+ _react.useImperativeHandle(imperativeVirtualizerRef, ()=>{
416
424
  return {
417
425
  progressiveSizes: childProgressiveSizes,
418
426
  nodeSizes: childSizes,
@@ -425,7 +433,7 @@ function useVirtualizer_unstable(props) {
425
433
  ]);
426
434
  // Initialization on mount - update array index to 0 (ready state).
427
435
  // Only fire on mount (no deps).
428
- (0, _react.useEffect)(()=>{
436
+ _react.useEffect(()=>{
429
437
  if (actualIndex < 0) {
430
438
  batchUpdateNewIndex(0);
431
439
  }
@@ -435,9 +443,9 @@ function useVirtualizer_unstable(props) {
435
443
  * forceUpdate:
436
444
  * We only want to trigger this when scrollLoading is enabled and set to false,
437
445
  * it will force re-render all children elements
438
- */ const forceUpdate = (0, _react.useReducer)(()=>({}), {})[1];
446
+ */ const forceUpdate = _react.useReducer(()=>({}), {})[1];
439
447
  // If the user passes in an updated renderChild function - update current children
440
- (0, _react.useEffect)(()=>{
448
+ _react.useEffect(()=>{
441
449
  if (actualIndex >= 0) {
442
450
  updateChildRows(actualIndex);
443
451
  if (enableScrollLoad && !isScrolling) {
@@ -449,16 +457,17 @@ function useVirtualizer_unstable(props) {
449
457
  renderChild,
450
458
  isScrolling
451
459
  ]);
452
- (0, _react.useEffect)(()=>{
460
+ _react.useEffect(()=>{
453
461
  // Ensure we repopulate if getItemSize callback changes
454
462
  populateSizeArrays();
455
463
  // We only run this effect on getItemSize change (recalc dynamic sizes)
456
464
  // eslint-disable-next-line react-hooks/exhaustive-deps
457
465
  }, [
458
- getItemSize
466
+ getItemSize,
467
+ gap
459
468
  ]);
460
469
  // Effect to check flag index on updates
461
- (0, _react.useEffect)(()=>{
470
+ _react.useEffect(()=>{
462
471
  if (!onRenderedFlaggedIndex || flaggedIndex.current === null) {
463
472
  return;
464
473
  }