diff --git a/docs/src/pages/docs/api.md b/docs/src/pages/docs/api.md index e8228cd7f..cbd16b813 100644 --- a/docs/src/pages/docs/api.md +++ b/docs/src/pages/docs/api.md @@ -14,6 +14,7 @@ const { totalSize, scrollToIndex, scrollToOffset, + scrollOffset, } = useVirtual({ size, parentRef, @@ -119,3 +120,7 @@ const { - `center` places the offset in the center of the visible scroll area - `end` places the offset at the bottom/right of the visible scroll area - `auto` brings the offset into the visible scroll area either at the start or end, depending on which is closer. If the offset is already in view, it is placed at the `top/left` of the visible scroll area. +- `scrollOffset: number` + - The scroll offset of the virtualizer at the time of rendering. + - Can be used to implement scroll position dependent functionality, such as pagination UI. + - `useVirtual` causes the host component to re-render on every scroll event. This offset is returned so you can implement scroll offset dependent functionality without adding second onScroll event which would result in double rendering and tearing. diff --git a/src/index.js b/src/index.js index 3cb17c2f6..350254a3f 100644 --- a/src/index.js +++ b/src/index.js @@ -281,6 +281,7 @@ export function useVirtual({ scrollToOffset, scrollToIndex, measure, + scrollOffset, } } diff --git a/src/tests/index.test.js b/src/tests/index.test.js index 4d93c5754..e8aff036d 100644 --- a/src/tests/index.test.js +++ b/src/tests/index.test.js @@ -24,6 +24,7 @@ function List({ return ( <> +