From 8db3bead13441a5882d8689dfc6a9f09c82375d9 Mon Sep 17 00:00:00 2001
From: Maze Winther <mazewinther@gmail.com>
Date: Wed, 25 Mar 2026 16:47:22 +0100
Subject: feat: masks, properties refactor, shaders, storage migrations, and
 more

---
 .../editor/panels/preview/snap-guides.tsx          | 30 +++++-----------------
 1 file changed, 6 insertions(+), 24 deletions(-)

(limited to 'apps/web/src/components/editor/panels/preview/snap-guides.tsx')

diff --git a/apps/web/src/components/editor/panels/preview/snap-guides.tsx b/apps/web/src/components/editor/panels/preview/snap-guides.tsx
index 4aa714a1..744304ea 100644
--- a/apps/web/src/components/editor/panels/preview/snap-guides.tsx
+++ b/apps/web/src/components/editor/panels/preview/snap-guides.tsx
@@ -1,43 +1,25 @@
 "use client";
 
-import { useEditor } from "@/hooks/use-editor";
+import { usePreviewViewport } from "@/components/editor/panels/preview/preview-viewport";
 import type { SnapLine } from "@/lib/preview/preview-snap";
-import { positionToOverlay } from "@/lib/preview/preview-coords";
 
-export function SnapGuides({
-	lines,
-	canvasRef,
-	containerRef,
-}: {
-	lines: SnapLine[];
-	canvasRef: React.RefObject<HTMLCanvasElement | null>;
-	containerRef: React.RefObject<HTMLDivElement | null>;
-}) {
-	const editor = useEditor();
-	const canvasSize = editor.project.getActive().settings.canvasSize;
-	const canvasRect = canvasRef.current?.getBoundingClientRect();
-	const containerRect = containerRef.current?.getBoundingClientRect();
+export function SnapGuides({ lines }: { lines: SnapLine[] }) {
+	const viewport = usePreviewViewport();
 
-	if (!canvasRect || !containerRect || lines.length === 0) {
+	if (lines.length === 0) {
 		return null;
 	}
 
 	const toOverlayX = (logicalX: number) =>
-		positionToOverlay({
+		viewport.positionToOverlay({
 			positionX: logicalX,
 			positionY: 0,
-			canvasRect,
-			containerRect,
-			canvasSize,
 		}).x;
 
 	const toOverlayY = (logicalY: number) =>
-		positionToOverlay({
+		viewport.positionToOverlay({
 			positionX: 0,
 			positionY: logicalY,
-			canvasRect,
-			containerRect,
-			canvasSize,
 		}).y;
 
 	return (
-- 
cgit v1.3.1