refactor(snaps): remove point markers from snaplines

packages/excalidraw/renderer/renderSnaps.ts

@@ -8,7 +8,6 @@ import type { InteractiveCanvasAppState } from "../types";
 const SNAP_COLOR_LIGHT = "#ff6b6b";
 const SNAP_COLOR_DARK = "#ff0000";
 const SNAP_WIDTH = 1;
-const SNAP_CROSS_SIZE = 2;
 
 export const renderSnaps = (
   context: CanvasRenderingContext2D,
@@ -19,8 +18,6 @@ export const renderSnaps = (
   }
 
   // in dark mode, we need to adjust the color to account for color inversion.
-  // Don't change if zen mode, because we draw only crosses, we want the
-  // colors to be more visible
   const snapColor =
     appState.theme === THEME.LIGHT || appState.zenModeEnabled
       ? SNAP_COLOR_LIGHT
@@ -38,7 +35,7 @@ export const renderSnaps = (
       context.lineWidth = snapWidth;
       context.strokeStyle = snapColor;
 
-      drawPointerSnapLine(snapLine, context, appState);
+      drawPointerSnapLine(snapLine, context);
     } else if (snapLine.type === "gap") {
       context.lineWidth = snapWidth;
       context.strokeStyle = snapColor;
@@ -53,7 +50,7 @@ export const renderSnaps = (
     } else if (snapLine.type === "points") {
       context.lineWidth = snapWidth;
       context.strokeStyle = snapColor;
-      drawPointsSnapLine(snapLine, context, appState);
+      drawPointsSnapLine(snapLine, context);
     }
   }
 
@@ -63,50 +60,18 @@ export const renderSnaps = (
 const drawPointsSnapLine = (
   pointSnapLine: PointSnapLine,
   context: CanvasRenderingContext2D,
-  appState: InteractiveCanvasAppState,
 ) => {
-  if (!appState.zenModeEnabled) {
-    const firstPoint = pointSnapLine.points[0];
-    const lastPoint = pointSnapLine.points[pointSnapLine.points.length - 1];
+  const firstPoint = pointSnapLine.points[0];
+  const lastPoint = pointSnapLine.points[pointSnapLine.points.length - 1];
 
-    drawLine(firstPoint, lastPoint, context);
-  }
-
-  for (const point of pointSnapLine.points) {
-    drawCross(point, appState, context);
-  }
+  drawLine(firstPoint, lastPoint, context);
 };
 
 const drawPointerSnapLine = (
   pointerSnapLine: PointerSnapLine,
   context: CanvasRenderingContext2D,
-  appState: InteractiveCanvasAppState,
 ) => {
-  drawCross(pointerSnapLine.points[0], appState, context);
-  if (!appState.zenModeEnabled) {
-    drawLine(pointerSnapLine.points[0], pointerSnapLine.points[1], context);
-  }
-};
-
-const drawCross = <Point extends LocalPoint | GlobalPoint>(
-  [x, y]: Point,
-  appState: InteractiveCanvasAppState,
-  context: CanvasRenderingContext2D,
-) => {
-  context.save();
-  const size =
-    (appState.zenModeEnabled ? SNAP_CROSS_SIZE * 1.5 : SNAP_CROSS_SIZE) /
-    appState.zoom.value;
-  context.beginPath();
-
-  context.moveTo(x - size, y - size);
-  context.lineTo(x + size, y + size);
-
-  context.moveTo(x + size, y - size);
-  context.lineTo(x - size, y + size);
-
-  context.stroke();
-  context.restore();
+  drawLine(pointerSnapLine.points[0], pointerSnapLine.points[1], context);
 };
 
 const drawLine = <Point extends LocalPoint | GlobalPoint>(