fix cursor playhead

src/components/video-editor/timeline/Row.tsx

@@ -10,6 +10,7 @@ interface RowProps extends RowDefinition {
 	onMouseEnter?: React.MouseEventHandler<HTMLDivElement>;
 	onMouseMove?: React.MouseEventHandler<HTMLDivElement>;
 	onMouseLeave?: React.MouseEventHandler<HTMLDivElement>;
+	onMouseDown?: React.MouseEventHandler<HTMLDivElement>;
 	onClick?: React.MouseEventHandler<HTMLDivElement>;
 }
 
@@ -23,6 +24,7 @@ export default function Row({
 	onMouseEnter,
 	onMouseMove,
 	onMouseLeave,
+	onMouseDown,
 	onClick,
 }: RowProps) {
 	const { setNodeRef, rowWrapperStyle, rowStyle } = useRow({ id });
@@ -52,6 +54,7 @@ export default function Row({
 				onMouseEnter={onMouseEnter}
 				onMouseMove={onMouseMove}
 				onMouseLeave={onMouseLeave}
+				onMouseDown={onMouseDown}
 				onClick={onClick}
 			>
 				{children}

src/components/video-editor/timeline/components/viewport/TimelineCanvas.tsx

@@ -169,6 +169,10 @@ function useTimelineHover({
 		setZoomRowHoverMs(null);
 	}, []);
 
+	const handleZoomRowMouseDown = useCallback((event: MouseEvent<HTMLDivElement>) => {
+		event.stopPropagation();
+	}, []);
+
 	const handleZoomRowClick = useCallback(
 		(event: MouseEvent<HTMLDivElement>) => {
 			event.stopPropagation();
@@ -212,6 +216,7 @@ function useTimelineHover({
 		handleZoomRowMouseEnter,
 		handleZoomRowMouseMove,
 		handleZoomRowMouseLeave,
+		handleZoomRowMouseDown,
 		handleZoomRowClick,
 	};
 }
@@ -243,6 +248,7 @@ interface TimelineCanvasRowsProps {
 	onZoomRowMouseEnter: MouseEventHandler<HTMLDivElement>;
 	onZoomRowMouseMove: MouseEventHandler<HTMLDivElement>;
 	onZoomRowMouseLeave: MouseEventHandler<HTMLDivElement>;
+	onZoomRowMouseDown: MouseEventHandler<HTMLDivElement>;
 	onZoomRowClick: MouseEventHandler<HTMLDivElement>;
 }
 
@@ -309,6 +315,7 @@ const TimelineCanvasRows = memo(function TimelineCanvasRows({
 	onZoomRowMouseEnter,
 	onZoomRowMouseMove,
 	onZoomRowMouseLeave,
+	onZoomRowMouseDown,
 	onZoomRowClick,
 }: TimelineCanvasRowsProps) {
 	const hiddenIds = useMemo(() => new Set(liveHiddenItemIds ?? []), [liveHiddenItemIds]);
@@ -417,6 +424,7 @@ const TimelineCanvasRows = memo(function TimelineCanvasRows({
 				onMouseEnter={onZoomRowMouseEnter}
 				onMouseMove={onZoomRowMouseMove}
 				onMouseLeave={onZoomRowMouseLeave}
+				onMouseDown={onZoomRowMouseDown}
 				onClick={onZoomRowClick}
 			>
 				{canShowGhostZoom && ghostStartMs !== null && (
@@ -693,6 +701,7 @@ export default function TimelineCanvas({
 		handleZoomRowMouseEnter,
 		handleZoomRowMouseMove,
 		handleZoomRowMouseLeave,
+		handleZoomRowMouseDown,
 		handleZoomRowClick,
 	} = useTimelineHover({
 		direction,
@@ -764,6 +773,7 @@ export default function TimelineCanvas({
 					onZoomRowMouseEnter={handleZoomRowMouseEnter}
 					onZoomRowMouseMove={handleZoomRowMouseMove}
 					onZoomRowMouseLeave={handleZoomRowMouseLeave}
+					onZoomRowMouseDown={handleZoomRowMouseDown}
 					onZoomRowClick={handleZoomRowClick}
 				/>
 			</div>