From e50a817b97b87baa0cd8fdde0fdb5d607143c1c3 Mon Sep 17 00:00:00 2001
From: Maze Winther <mazewinther@gmail.com>
Date: Sun, 8 Feb 2026 22:21:17 +0100
Subject: add transform + few fixes

feat: transform
feat: batch command
fix: slider undo
fix: timeline zoom perf
refactor: make updateElement support multiple
---
 apps/web/src/hooks/timeline/use-scroll-position.ts | 52 ++++++++++++++++++++++
 1 file changed, 52 insertions(+)
 create mode 100644 apps/web/src/hooks/timeline/use-scroll-position.ts

(limited to 'apps/web/src/hooks/timeline')

diff --git a/apps/web/src/hooks/timeline/use-scroll-position.ts b/apps/web/src/hooks/timeline/use-scroll-position.ts
new file mode 100644
index 00000000..ad2c6374
--- /dev/null
+++ b/apps/web/src/hooks/timeline/use-scroll-position.ts
@@ -0,0 +1,52 @@
+import { useEffect, useState, useRef } from "react";
+
+interface UseScrollPositionReturn {
+	scrollLeft: number;
+	viewportWidth: number;
+}
+
+export function useScrollPosition({
+	scrollRef,
+}: {
+	scrollRef: React.RefObject<HTMLElement | null>;
+}): UseScrollPositionReturn {
+	const [scrollLeft, setScrollLeft] = useState(0);
+	const [viewportWidth, setViewportWidth] = useState(0);
+	const rafIdRef = useRef<number | null>(null);
+
+	useEffect(() => {
+		const scrollElement = scrollRef.current;
+		if (!scrollElement) return;
+
+		const updatePosition = () => {
+			if (rafIdRef.current !== null) {
+				cancelAnimationFrame(rafIdRef.current);
+			}
+
+			rafIdRef.current = requestAnimationFrame(() => {
+				setScrollLeft(scrollElement.scrollLeft);
+				setViewportWidth(scrollElement.clientWidth);
+				rafIdRef.current = null;
+			});
+		};
+
+		const resizeObserver = new ResizeObserver(() => {
+			updatePosition();
+		});
+
+		updatePosition();
+
+		scrollElement.addEventListener("scroll", updatePosition, { passive: true });
+		resizeObserver.observe(scrollElement);
+
+		return () => {
+			scrollElement.removeEventListener("scroll", updatePosition);
+			resizeObserver.disconnect();
+			if (rafIdRef.current !== null) {
+				cancelAnimationFrame(rafIdRef.current);
+			}
+		};
+	}, [scrollRef]);
+
+	return { scrollLeft, viewportWidth };
+}
-- 
cgit v1.3.1