Scroll this container
The progress bar at the top tracks your scroll position.
Content block 1
Content block 2
Content block 3
Content block 4
Content block 5
Content block 6
Content block 7
Content block 8
Content block 9
Content block 10
Content block 11
Content block 12
Content block 13
Content block 14
Content block 15
container?RefObject<HTMLElement | null>| Prop | Type | Default |
|---|---|---|
container? | RefObject<HTMLElement | null> | - |
import { ScrollLinked } from '@k8ordo/ui';const containerRef = useRef<HTMLDivElement>(null);
<div
className="relative h-64 overflow-y-scroll rounded-lg border"
ref={containerRef}
>
<ScrollLinked container={containerRef} />
<div className="h-[800px] p-4">
<p>Scroll this container to see the progress bar.</p>
</div>
</div>// Without a container prop, ScrollLinked tracks the window scroll position.
<ScrollLinked />