From f9eefcc7cd25ccd088999ca31f3f96c566c8dcf2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Sebastian=20Kr=C3=BCger?= <valknar@pivoine.art>
Date: Fri, 21 Nov 2025 21:13:01 +0100
Subject: [PATCH] fix: add missing pointer event handlers for selection and
 drawing tools
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Fixed multiple tools that were not working due to missing pointer event handlers:

**Selection Tools (rectangular, elliptical, lasso, magic-wand):**
- Added pointer move handler to draw selection preview while dragging
- Added pointer up handler to finalize selection and update selection store
- Selection tools now show live preview and create selections correctly

**Drawing Tools (clone, smudge, dodge/burn):**
- Added clone, smudge, and dodge to pointer up handler
- These tools now properly capture state changes in history
- Canvas re-renders correctly after using these tools

All affected tools now have complete pointer event handling:
- onPointerDown: Initialize tool state
- onPointerMove: Update preview/drawing while pointer is down
- onPointerUp: Finalize changes and update history

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
---
 components/canvas/canvas-with-tools.tsx | 49 ++++++++++++++++++++++++-
 1 file changed, 48 insertions(+), 1 deletion(-)

diff --git a/components/canvas/canvas-with-tools.tsx b/components/canvas/canvas-with-tools.tsx
index 5b06e15..71dc8a7 100644
--- a/components/canvas/canvas-with-tools.tsx
+++ b/components/canvas/canvas-with-tools.tsx
@@ -479,6 +479,35 @@ export function CanvasWithTools({ onCursorMove }: CanvasWithToolsProps = {}) {
       return;
     }
 
+    // Selection tools
+    const selectionTools = ['select', 'rectangular-select', 'elliptical-select', 'lasso-select', 'magic-wand'];
+    if (pointer.isDown && selectionTools.includes(activeTool)) {
+      const activeLayer = getActiveLayer();
+      if (!activeLayer || !activeLayer.canvas) return;
+
+      const tool = toolsCache.current[`${selectionType}-select`] || toolsCache.current['select'];
+      if (!tool) return;
+
+      const newPointer: PointerState = {
+        ...pointer,
+        x: canvasPos.x,
+        y: canvasPos.y,
+        pressure: e.pressure || 1,
+        altKey: e.altKey,
+        ctrlKey: e.ctrlKey,
+        shiftKey: e.shiftKey,
+        metaKey: e.metaKey,
+      };
+
+      setPointer(newPointer);
+
+      const ctx = activeLayer.canvas.getContext('2d');
+      if (ctx) {
+        tool.onPointerMove(newPointer, ctx, settings);
+      }
+      return;
+    }
+
     // Drawing
     if (pointer.isDown && ['pencil', 'brush', 'eraser', 'eyedropper', 'shape', 'clone', 'smudge', 'dodge'].includes(activeTool)) {
       const activeLayer = getActiveLayer();
@@ -531,7 +560,25 @@ export function CanvasWithTools({ onCursorMove }: CanvasWithToolsProps = {}) {
       return;
     }
 
-    if (pointer.isDown && ['pencil', 'brush', 'eraser', 'fill', 'eyedropper', 'shape'].includes(activeTool)) {
+    // Selection tools
+    const selectionTools = ['select', 'rectangular-select', 'elliptical-select', 'lasso-select', 'magic-wand'];
+    if (pointer.isDown && selectionTools.includes(activeTool)) {
+      const activeLayer = getActiveLayer();
+      if (!activeLayer || !activeLayer.canvas) return;
+
+      const tool = toolsCache.current[`${selectionType}-select`] || toolsCache.current['select'];
+      if (tool) {
+        const ctx = activeLayer.canvas.getContext('2d');
+        if (ctx) {
+          tool.onPointerUp(pointer, ctx, settings);
+        }
+      }
+
+      setPointer({ ...pointer, isDown: false });
+      return;
+    }
+
+    if (pointer.isDown && ['pencil', 'brush', 'eraser', 'fill', 'eyedropper', 'shape', 'clone', 'smudge', 'dodge'].includes(activeTool)) {
       const activeLayer = getActiveLayer();
       if (!activeLayer || !activeLayer.canvas) return;