Skip to content

Commit 2a536d7

Browse files
committed
refactor: reposition items on height changes
1 parent cd63f9b commit 2a536d7

File tree

1 file changed

+9
-3
lines changed

1 file changed

+9
-3
lines changed

src/components/Timeline.tsx

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -90,10 +90,16 @@ export function Timeline(props: TimelineProps) {
9090
}, [styleConfig]);
9191

9292
useEffect(() => {
93-
window.addEventListener('resize', positionTimelineItems);
94-
return () => window.removeEventListener('resize', positionTimelineItems);
93+
const resizeObserver = new ResizeObserver(positionTimelineItems);
94+
95+
if (leftContainer.current) {
96+
resizeObserver.observe(leftContainer.current);
97+
}
98+
if (rightContainer.current) {
99+
resizeObserver.observe(rightContainer.current);
100+
}
101+
return () => resizeObserver.disconnect();
95102
}, []);
96-
useEffect(positionTimelineItems, [itemsRef]);
97103

98104
return (
99105
<div className={['timeline', `timeline--${positioning}`, className].join(' ')} ref={timelineRef}>

0 commit comments

Comments
 (0)