diff --git a/examples/state.tsx b/examples/state.tsx
index 712d3b867..0cbb866af 100644
--- a/examples/state.tsx
+++ b/examples/state.tsx
@@ -1,6 +1,10 @@
import * as React from 'react'
import { StateSnapshot, Virtuoso, VirtuosoHandle } from '../src'
+function Header() {
+ return
Header
+}
+
export function Example() {
const ref = React.useRef(null)
const state = React.useRef(undefined)
@@ -25,6 +29,9 @@ export function Example() {
ref={ref}
restoreStateFrom={state.current}
computeItemKey={(key: number) => `item-${key.toString()}`}
+ components={{
+ Header,
+ }}
totalCount={100}
itemContent={(index) => Item {index}
}
style={{ height: 300 }}
diff --git a/src/stateLoadSystem.ts b/src/stateLoadSystem.ts
index b49ef34a9..1b14b6ecd 100644
--- a/src/stateLoadSystem.ts
+++ b/src/stateLoadSystem.ts
@@ -9,7 +9,7 @@ import { windowScrollerSystem } from './windowScrollerSystem'
export const stateLoadSystem = u.system(
([
{ sizes, sizeRanges },
- { scrollTop },
+ { scrollTop, headerHeight },
{ initialTopMostItemIndex },
{ didMount },
{ useWindowScroll, windowScrollContainerState, windowViewportRect },
@@ -24,12 +24,16 @@ export const stateLoadSystem = u.system(
u.connect(windowViewportRect, statefulWindowViewportRect)
u.subscribe(
- u.pipe(getState, u.withLatestFrom(sizes, scrollTop, useWindowScroll, statefulWindowScrollContainerState, statefulWindowViewportRect)),
- ([callback, sizes, scrollTop, useWindowScroll, windowScrollContainerState, windowViewportRect]) => {
+ u.pipe(
+ getState,
+ u.withLatestFrom(sizes, scrollTop, useWindowScroll, statefulWindowScrollContainerState, statefulWindowViewportRect, headerHeight)
+ ),
+ ([callback, sizes, scrollTop, useWindowScroll, windowScrollContainerState, windowViewportRect, headerHeight]) => {
const ranges = sizeTreeToRanges(sizes.sizeTree)
if (useWindowScroll && windowScrollContainerState !== null && windowViewportRect !== null) {
scrollTop = windowScrollContainerState.scrollTop - windowViewportRect.offsetTop
}
+ scrollTop -= headerHeight
callback({ ranges, scrollTop })
}
)