1 files changed, 43 insertions, 9 deletions

diff --git a/apps/web/src/components/editor/panels/preview/preview-interaction-overlay.tsx b/apps/web/src/components/editor/panels/preview/preview-interaction-overlay.tsx
index c13379f0..4c33a1a1 100644
--- a/apps/web/src/components/editor/panels/preview/preview-interaction-overlay.tsx
+++ b/apps/web/src/components/editor/panels/preview/preview-interaction-overlay.tsx
@@ -1,20 +1,54 @@
 import { usePreviewInteraction } from "@/hooks/use-preview-interaction";
-import { cn } from "@/utils/ui";
+import { TransformHandles } from "./transform-handles";
+import { SnapGuides } from "./snap-guides";
+import { TextEditOverlay } from "./text-edit-overlay";
 
 export function PreviewInteractionOverlay({
 	canvasRef,
+	containerRef,
 }: {
 	canvasRef: React.RefObject<HTMLCanvasElement | null>;
+	containerRef: React.RefObject<HTMLDivElement | null>;
 }) {
-	const { onPointerDown, onPointerMove, onPointerUp } =
-		usePreviewInteraction({ canvasRef });
+	const {
+		onPointerDown,
+		onPointerMove,
+		onPointerUp,
+		onDoubleClick,
+		snapLines,
+		editingText,
+		commitTextEdit,
+		cancelTextEdit,
+	} = usePreviewInteraction({ canvasRef });
 
 	return (
-		<div
-			className={cn("absolute inset-0 pointer-events-auto")}
-			onPointerDown={onPointerDown}
-			onPointerMove={onPointerMove}
-			onPointerUp={onPointerUp}
-		/>
+		<div className="absolute inset-0">
+			{/* biome-ignore lint/a11y/noStaticElementInteractions: canvas overlay, pointer-only interaction */}
+			<div
+				className="absolute inset-0 pointer-events-auto"
+				onPointerDown={onPointerDown}
+				onPointerMove={onPointerMove}
+				onPointerUp={onPointerUp}
+				onDoubleClick={onDoubleClick}
+			/>
+			{editingText ? (
+				<TextEditOverlay
+					canvasRef={canvasRef}
+					containerRef={containerRef}
+					trackId={editingText.trackId}
+					elementId={editingText.elementId}
+					element={editingText.element}
+					onCommit={commitTextEdit}
+					onCancel={cancelTextEdit}
+				/>
+			) : (
+				<TransformHandles canvasRef={canvasRef} containerRef={containerRef} />
+			)}
+			<SnapGuides
+				lines={snapLines}
+				canvasRef={canvasRef}
+				containerRef={containerRef}
+			/>
+		</div>
 	);
 }